He just crawled through hell to fix the browser…

TL;DR

Pretext bypasses expensive browser layout reflows by measuring text dimensions in pure TypeScript, enabling fast virtualized lists and complex text-heavy UIs.

Key Points

• 1.Browser text measurement triggers costly layout reflows. Every time a browser calculates text height or line breaks, it recalculates the position and geometry of every element on the page — one of the most expensive browser operations, making virtualized lists and masonry layouts extremely difficult to build.
• 2.Changlu, ex-React core team member and Midjourney engineer, built Pretext to bypass this entirely. He used the Canvas API (outside the DOM) to get pixel-accurate string widths without reflows, then wrote a custom line-break algorithm trained by AI agents testing against real browsers across multiple languages and weeks of iteration.
• 3.Pretext's API is deceptively simple despite the engineering complexity. Calling `prepare` segments and caches each text chunk's pixel width, while `layout` returns total height and line count — all without touching the DOM, making high-performance text-heavy UIs finally practical.
• 4.A live demo showed Pretext powering an ASCII video renderer where characters are placed using brightness values. The script is processed through `prepareWithSegments`, then `layoutNextLine` is called per row to map characters to exact grid cells, with video pixel brightness determining which characters appear — Pretext handles precise character placement throughout.