直接回答:传统 SSR 的 hydration 在客户端重新执行全部组件代码重建“状态与事件绑定的映射”;resumability 让服务端在渲染时把这个映射序列化进 HTML(组件状态、闭包引用、事件监听位置),客户端拿到后无需执行任何组件代码即处于“可继续”状态——事件触发时才按需下载对应 handler 的代码块,实现交互前零 JS 执行。

展开解析:机制拆解:服务端渲染时 Qwik 把应用状态 JSON 序列化进 ,事件处理函数编译成带符号名的独立 chunk,DOM 上标记 on:click="./chunk.js#handler" 这样的引用;客户端只有一个极小的启动器(~1KB)全局监听事件,事件命中时动态 import 对应 chunk、按序列化信息恢复闭包上下文执行。对比谱系:hydration 是“重放”(replay),resumability 是“续跑”(resume);岛屿架构减少水合范围但岛屿内仍要执行,Qwik 连岛屿初始化都免了。收益曲线:页面越复杂收益越大——传统框架 hydration 成本随组件数线性涨,Qwik 接近常数;交互少的页面(营销页)两者趋同(反正 JS 都不多)。代价与约束:写法受序列化约束($() 标记可序列化边界,闭包捕获的必须是可序列化数据);生态与人才池小;SEO/无 JS 场景与传统 SSR 等价无差异。技术影响大于市占:它提出的问题(hydration 为何必须重放)推动了 React Server Components(服务端组件完全不下发 JS)等方向的思考。评估时记住指标:看 INP 与交互前 JS 字节数,而非笼统的“性能”。

追问方向:序列化闭包与 React Server Components 的序列化边界有何相似?Qwik 的预取策略如何设计?

(约 490 字)