「Pretext」前端圈大地震！超1800万人围观，上线一天狂揽1.5w颗星！AI把浏览器...

不二如是

困扰前端行业多年的“文本排版性能问题”，本质上一直卡在浏览器的DOM机制上。

在线学习：



地址：

游客，如果您要查看本帖隐藏内容请回复

传统做法必须先把文字插入DOM，再通过诸如getBoundingClientRect这类接口测量尺寸，这一步会触发昂贵的layout reflow。

只要是流式输出、动态内容或者大量文本组件，这种“写入→测量→重排”的循环就会被不断触发，性能迅速恶化，严重时一帧就可能耗掉几十毫秒，直接导致界面卡顿甚至掉帧 。

这也是为什么AI流式输出看起来丝滑，底层却在疯狂消耗浏览器性能。

而最近爆火的Pretext，本质上是在架构层“绕开DOM”。

它是由React核心开发者Cheng Lou发布的一个TypeScript库，核心思路不是优化DOM，而是彻底不依赖DOM进行排版。

Pretext会在代码层先对文本进行分段、测量，并缓存每个词或字符的宽度，再通过纯数学算法完成换行、排版和高度计算。

整个layout过程不再依赖浏览器渲染，而是变成一次纯计算过程，从而避免了reflow这一性能黑洞 。

这种方式甚至可以在文本还没渲染之前，就提前知道最终排版结果。

性能上的提升也因此非常夸张。

在一些基准测试中，Pretext在批量文本排版场景下可以做到接近数量级的优化，例如500段文本的layout计算仅需约0.09ms，远低于传统DOM方案 。

业界普遍将其描述为“最高可达数百倍提升”，尤其在频繁重排、虚拟列表、聊天流式输出等场景中优势明显 。

换句话说，它不是让浏览器更快，而是直接绕开浏览器的慢路径，建立了一套“用户态排版引擎”。

这也意味着，过去在流畅动画和复杂文本之间必须做取舍的场景，现在开始有机会同时实现。

评论区聊聊你的想法吧

                               
登录/注册后可看大图

>>万能兑换C币许愿池<<

如果有收获，别忘了评分 ：

                               
登录/注册后可看大图

                               
登录/注册后可看大图