部署、性能与测试
Qwik 的性能收益取决于 chunk 边界、缓存和真实网络,而不是只看源码大小。测试分纯函数、组件交互、真实导航;预渲染页面还要验证 hydration 后行为。
实验:用固定网络条件比较首屏 HTML 和交互后 chunk 请求,记录限制。
本节专属实验:观察可恢复边界
先查看服务端 HTML,再点击按钮并记录首次加载的事件 chunk。把 $ 后缀去掉或把不可序列化对象放进 state,记录构建阶段和恢复阶段分别在哪里失败。
tsx
const count = useSignal(0)
return <button onClick$={() => count.value++}>{count.value}</button>预期:首屏包含文本,交互发生时才加载处理器;服务端和客户端初始标记必须一致。
可运行实验
- 在开发者工具中记录初始 HTML、交互触发的 chunk 和网络顺序。
- 把闭包捕获的 DOM 节点、函数和普通数据分别放进状态,比较可恢复性错误。
- 解释该概念在 SSR、客户端恢复和部署缓存之间的边界。
实验记录至少包含:环境版本、输入序列、预期结果、实际结果、失败截图或日志,以及修复后再次运行的结果。
练习
- 用自己的话画出本篇概念的依赖图,并标出一个可能产生重复执行或竞态的节点。
- 写一个最小测试覆盖成功、失败、取消/卸载三条路径;测试应断言可观察结果,而不是内部实现调用次数。
- 给出一个选择当前方案而不是替代方案的理由,并写下替代方案何时更合适。