Midjourney 工程师开源 Pretext：用 AI 辅助编码，绕过 DOM 重排

Pretext 是一个帮你搞定网页文字排版与测量的轻量级工具，能让你在浏览器里把多行文字玩出动态花样，而且丝毫不卡顿。

它是 Midjourney 工程师 Cheng Lou 在 2026 年 3 月 27 日开源的。整个库只有 15KB，没有任何第三方依赖，采用 MIT 许可证，基于 TypeScript 开发。更有意思的是，作者是借助 OpenAI Codex 和 Anthropic Claude 这类 AI 辅助编程工具把这个底层库写出来的。

它能做什么

在传统网页上，想让文字随着动态元素灵活变化几乎是个性能灾难，而 Pretext 彻底解决了这个问题。

它把多行文本变成了一个完全动态、能够即时响应交互的排版空间。文字可以在移动的物体周围流畅穿梭和环绕，即便你拖动其他元素撞击文本块，或者快速拉伸浏览器窗口，它也能稳稳维持单词和行与行之间的间距。

开源刚几天，社区就用它做出了不少脑洞 demo。有人做了一条在文字方块里穿梭喷火的飞龙，火焰喷过时周围的字符会像被推开一样实时避让融化。

还有人做了一个手机应用，用户必须把手机水平拿稳才能看书，只要机身一倾斜，页面上的字母就像托盘里的豆子一样滑落堆在一角。甚至有人做出了在看电影《Project Hail Mary》的同时同步阅读原著，所有画面全是由响应式动态文字拼出来的。

除了这些眼花缭乱的演示，它在实际产品里也有很实用的场景。比如有开发者正在用它为阅读障碍者制作定制工具，让用户能随意调节字体大小和字间距而不破坏整体排版。

怎么做到的

长期以来，网页要测量一个段落有多高、某一行文字在哪，必须去向浏览器的 DOM 发起查询。

调用像 getBoundingClientRect 或 offsetHeight 这类传统 API，很容易触发耗时的 DOM 重排。这就像居民每次推开家门，整座城市都必须重新画一遍地图一样昂贵。

Pretext 的聪明之处在于，它把多行文字的测量和排版逻辑全部搬到了前端应用层自己算，彻底绕过了浏览器 DOM 和底层的性能瓶颈。

发布仅仅 48 小时内，Pretext 就在 GitHub 上拿下了超过 1.4 万颗星，在 X 上的浏览量也突破了 1900 万次。想体验的话，Pretext 的源码已经完整托管在 GitHub 上，开发者可以直接克隆仓库或跑起 demo。

为什么重要

如果你是前端开发者、网页设计师，或者正在做富文本编辑器和创意交互页面，Pretext 非常值得你现在就去试一试。它把过去需要写一套极其复杂且不可通用的专用逻辑才能实现的动态排版，变成了一个即插即用的轻量模块。

虽然有人指出很多炫技 demo 让文字变得难以阅读，但我们认为这挑错了重点。这个项目的真正价值在于打破了浏览器长期以来的排版性能枷锁，而且它证明了借助 AI 辅助编码，单个开发者也能单枪匹马攻克底层的架构难题。