Pretext — библиотека, которая считает текстовую вёрстку в 500 раз быстрее браузера. Зачем это нужно и как работает

[Alexandroppolus]

История про то, как внутри браузера реализована некая довольно полезная функциональность, но по каким-то причинам до сих пор нет нормального браузерного api к ней, и пришлось дублировать реализацию. Не в первый раз, кажется.

[Akuma]

На этой логике весь веб работает :)

[WFF]

Генерация pdf - вот, где оно нужно

[cmyser]

Вау, никогда такого не было и вот опять придумали как не взаимодействовать с dom

[Alexandroppolus]

А если держать на странице отдельный iframe с минимумом верстки, и измерять текст внутри него - это тоже будет долгий layout рефлоу?

[JerryI]

Да, подобное делали в невидимом летающем контейнере. Но рефлоу даже внутри него мелкого тормоза. Странно конечно, что canvas всё равно выигрывает. Возможно потому, что там не "честные" глифы рисуют. Как уже сказали раньше, если был бы API к reflow механизму страницу, то все проблемы бы решились без канвасов

[Alexandroppolus]

Странно конечно, что canvas всё равно выигрывает. Возможно потому, что там не "честные" глифы рисуют.

canvas вообще не рисует, у него есть метод, который просто измеряет размеры строки в пикселях, но там нельзя например задать ограничение по ширине, то есть никакого выравнивания он не делает. Потому и быстрый.

[inikonzs]

он перестанет быть долгим даже просто на скрытом абсолюте, он не будет афектить ничего. А канвас выигрывает да, за счет отсутствия самого факта рендера

[Sap_ru]

Есть стойкое ощущение, что эта проблема давным давно решена без вот этого велосипеда. Просто нужно размеры кэшировать, а не всё заново пересчитывать. Текст-то только растёт.

[shemmmil]

Классаня статья, спасибо за разбор данной библиотеки.

[meowpointerexception]

В реальных проектах те же проблемы обычно закрываются батчингом обновлений и снижением частоты reflow

[inikonzs]

читал, всё время думал, ну canvasRenderingContext2d.measureText на то есть. И да, он самый и есть оказалось)

[Dren0r]

кроме поиграться с дракончиком - никакой пользы от библиотеки нет. Все UI проектируются блоками, а не обтеканием текста вокруг какого-то объекта. Любой генеративный контент нормально рендерится без всяких библиотек.

Подобрая верстка может помочь только при газетных колонках, и то все было решено через float еще 20 лет назад, и сейчас не используется

[Lezvix]

Посмотри пример с чатом, там как раз демонстрируется максимально компактное уложение текста в блоки, для эффективного расходования пространства

[Dren0r]

и как часто в генеративном контенте двигается размер блока чата?
блок статичен, а меняется количество текста в нем, которое растет просто вниз.
Все вариации его отрисовки давно готовы в css - text-wrap, overflow-wrap, word-break, white-space, hyphens, text-overflow, line-clamp, line-break. Придумали настроек уже на любой случай жизни.

Эта библиотека просто красивый пет проект поиграться, практического применения там в лучшем случае на 1% каких-то задач, которые даже придумать не получается