У веб-дизайнеров революция: разраб из Midjourney придумал, как сделать обтекаемый текст в браузере — прямо как в глянцевых журналах
Бывший инженер Midjourney Cheng Lou выпустил библиотеку Pretext для точного измерения и расчёта многострочного текста. Главная фишка — технология не использует CSS и DOM-измерения (getBoundingClientRect, offsetHeight), которые триггерят дорогой reflow. Вместо этого библиотека реализует собственную логику измерения текста, используя браузерный движок как эталон.
Что умеет:
— Измерять высоту абзаца без единого обращения к DOM
— Раскладывать текст вручную строка за строкой с разной шириной (например, обтекание вокруг картинки)
— Поддерживает все языки, эмодзи и смешанное направление письма
— Работает с Canvas, SVG, WebGL и скоро на сервере
Цифры:
— prepare() (анализ текста) — около 19 мс для 500 текстов
— layout() (расчёт) — около 0,09 мс для той же пачки
Pretext написан на чистом TypeScript, поддерживается всеми современными браузерами.
Код доступен тут.
