【新智元导读】前端圈变天了！Midjourney大神出手，开源Pretext整宿爆红，成网页排版救星，透顶闭幕UI三十年难题。如今，全网1600万东说念主围不雅，透顶玩疯。
网页排版30年「地狱级」镣铐告破！
今天，前端圈被一个名为Pretext的口头透顶引爆，引来1600万东说念主豪恣围不雅。
它径直掀起了统帅网页长达30年的DOM渲染机制，收场了此前被视为「不成能」的豪举——
笔墨随放肆情景开脱流动、跨栏自动分拨、多维排版丝滑适配
更恐怖的是，Pretext让网页排版速率飙升数百倍，渲染体验直达120帧极致丝滑。
这款爆火口头，恰正是出自Midjourney前端工程师Cheng Lou之手。
用大神的原话来说，「我刚从地狱深处爬出，给你们带回了异日数年UI策划最繁重的基石之一」。
此时此刻，全网王人千里浸于Pretext的视觉盛宴中。那些直出排版的demo，好意思得压根不像网页。
评述区下方，全被叹息体刷屏了。
爆火Pretext口头，闭幕UI三十年困局
绝不夸张地说，Pretext的出世，亲手解开了阿谁困住前端思象力整整30年的死结。
一直以来，传统的文本测量荒谬依赖CSS、DOM Reflow，性能千里重如铅，动辄卡顿。
在浏览器寰球里，3D、动画和WebGL不错玩得天南地北。
可一朝触碰大范围文本渲染，开发者就得斯须「熄火」，卑微地向DOM黑盒协调。
假定你思知说念一段话塞进300px的框里有多高？莫得任何主义径直算出来。
你必须把文本强行塞进DOM树，让浏览器老淳结识排一遍版，再用getBoundingClientRect把收尾「问」追想。
这个商榷的历程，就叫作念——Reflow，成为网页卡顿的「头号元凶」。
而况这种测量没法并行，必须列队处理。一不阻止就酿成读写交错，性能径直崩盘。
为了照看这一难题，大神Cheng Lou聘用了一种最生猛的破局方式——
解除现成的器具，用纯TypeScript在用户态自研了一套高精度、极速文本测量引擎。
不碰DOM，不乞助于浏览器，径直暴力计较。
GitHub地址：https://github.com/chenglou/pretext
如何作念到的？
Cheng Lou找到了一条「后门」：浏览器的canvas.measureText和DOM渲染，底层用的是归拢套字体引擎。
但canvas有个妙处——它绝对在布局树除外启动，量若干次字王人不会触发Reflow。
Pretext的整套逻辑就开拓在这个梗阻口上。
它先用canvas把每个笔墨片断量一遍、宽度缓存住，之后岂论你如何拉伸窗口、切换布局，排版计较全是加减乘除。
网友辣评：Pretext是「新一代OpenClaw」，上线不外几天GitHub星标冲破11k
为了把精度打磨到极致，Cheng Lou把各大浏览器「的确渲染基准」数据，沿途喂给了Claude Code和Codex。
然后让它们在每一个关节的容器宽度下进行测量和迭代比对，扫数这个词历程跑了好几周。
没思到，实验收尾令东说念主战栗。
精度方面，Chrome、Safari、Firefox三大浏览器7680项穷举测试，沿途满分通过，像素级吻合。
性能数据更是炸裂。
在Chrome上，Pretext的layout耗时0.09毫秒，滚球app官网而传统DOM交错测量耗时43.50毫秒，快了483倍。
Safari上更夸张，layout 0.12毫秒，DOM交错测量149.00毫秒，快了超1242倍——整整三个数目级。
演示中，它能以120fps的丝滑帧率，处理数十万个文本框的滚动与缩放。
不需要DOM测量，可视区域查抄被简化成了对高度的单次、无缓存线性遍历。
它还能让聊天气泡齐全贴合文本现实——自动算出最紧凑的包裹宽度，未几一个像素。
这个多行文本「减弱包裹」的智商，Web上缺失了整整30年。
还有动态反应式的多栏杂志布局、变宽字体的ASCII艺术、富文本手动排版等等。
那些也曾是CSS恶梦的挑战——自允洽增高的文本域、折叠面板、多行文本居中、纯Canvas多行文本渲染，如今在Pretext眼前，全成了微不足道的赤子科。
值得一提的是，这个引擎天然只好15KB，却深谙浏览器的多样不端特质（quirks）。
它援助多样话语，包括韩语、从右向左书写的阿拉伯文，以及各平台特定的姿首标记。
全网玩疯，脑洞逆天
大神Cheng Lou仅仅开了个头，全网开发者上手试玩的脑洞，那才叫一个绝绝子。
就连Pretext之父本东说念主王人惊呆了
网友实测，仅需0.04毫秒，即可完成52种布局。
文本里，看二次元热舞
一巨额网友径直在笔墨渲染中，作念出了东说念主物动画的收尾。以后，一边看电影，一边看书。
「辉夜姬」里的藤原千花跳进了笔墨里，标识性的舞步配上及时流动的排版，号称是二次元照进了现实。
谁还不爱学习啊
有东说念主把物理定律搬进了笔墨排版，重力、碰撞、弹性，败兴的公式斯须在屏幕上具象化了。
在儿童绘本上诓骗这个收尾，笔墨围绕插画流动，翻页就像在玩游戏。
还有一巨额豪恣的演示——
站在巨东说念主肩膀上
能写出Pretext的东说念主，绝非闲散之辈。
Cheng Lou的资历简直串起了半部前端进化史。
手脚React Motion的创造者，ReasonML/ReScript话语的诞生者，Facebook Messenger前端的中枢架构师，他如今正在Midjourney用Bun撑起了扫数这个词UI体系。
但Pretext的火种，比他本东说念主更早。
十年前，React中枢团队的Sebastian Markbage就写过一个叫text-layout的实验口头——
Pretext的架构骨架，全从这来。
Cheng Lou在2016年ReactEurope的演讲里说过一句于今被反复援用的话：减少抒发力，反而能取得更大的力量。
十年后他亲手考证了这句话滚球app中国官方网站——砍掉DOM，排版反而开脱了。
一个中枢成员留住的实验性火种，十年后被另一个中枢成员点火成熊熊大火。
这还仅仅开首
在Cheng Lou看来，Pretext不仅是一个底层UI工程的基石级梗阻，更是一次架构层面的范式滚动。
如今，浏览器设施自身也曾彭胀到了简直不成能有新的竞争者投入的进程。
要从压根上收场UI性能和开发者体验的数目级提高，独一的长进等于把更多的智商交还给用户态——
让路发者我方掌控排版，而不是不息等CSS委员会开会连络下一个十年的特质草案。
这预示着网页UI将从传统的CSS按捺中开脱，迈向更具思象力的Canvas/GPU渲染时期。
而Cheng Lou在thoughts.md的临了，只留了一句话：
可考证软件的资本将趋向于零。
这句话，好像才是Pretext真确思说的。
乐鱼体育官方网站
备案号: