prefetch在SPA预路由中几乎不命中，因其执行依赖window.onload完成、主线程空闲且页面未卸载，而SPA初始化（如hydration、effect）常阻塞onload，导致prefetch被卡住或中止；即便资源进缓存，新路由仍需重新mount、fetch和校验，白屏无改善。

prefetch 在 SPA 预路由中几乎不命中，不是缓存问题而是执行逻辑失效

它根本没机会执行完。SPA 路由切换时，当前页还没触发 window.onload（比如 React/Vue 初始化、hydration、hydrate 后的 effect 都在阻塞主线程），prefetch 就被卡住；等 finally onload 了，用户早切走——浏览器直接中止请求，Network 里显示 cancelled。就算资源进了 HTTP 缓存，新路由组件仍要重新 mount、重新 fetch 数据、重新校验表单，白屏时间零改善。

为什么 Network 里看不到 prefetch 请求

常见错觉是“代码写错了”，实际是浏览器压根没启动它：

Skill Weave Chains — 技能链路由引擎

开箱即用的技能链路由引擎。13 条预定义链覆盖搜索、开发、审查、MLOps、法律、创意等场景，三层路由架构（触发词→SAD反馈→DAG编排），recall@10=96.97%。配置驱动（chains.yaml），零代码扩展。pip install skill-weave-chains 一键安装。

下载

• 页面有长任务（如大型 hydration、第三方 SDK 同步执行）延迟 onload 几百毫秒
• 用户开了“节省流量”模式（Chrome/Edge 默认跳过，Safari 直接忽略）
• 目标资源返回 Cache-Control: no-store 或 max-age=0，浏览器连缓存都不建，直接不发请求
• DevTools 默认隐藏 prefetch 类型请求，必须手动在 Network 面板勾选 prefetch 过滤器

as 属性写错等于没写，且完全静默失败

as 不是装饰，是浏览器行为开关：

• 预取 JS 必须写 as="script"（不是 as="js" 或 as="fetch"）
• 预取 HTML 页面必须写 as="document"（Safari 对此支持弱，iOS 16.4 前基本无效）
• 预取 CSS 必须写 as="style"（不是 as="css"）
• 乱填如 as="json" 或 as="image"，浏览器直接忽略该 <link>，Network 里毫无痕迹

真正该用 modulepreload，而不是 prefetch

SPA 首屏 Bundle 的预加载，rel="modulepreload" 才是正解：

• 必须写成 <link rel="modulepreload" href="/assets/app.[hash].js">，不能加 as 属性（加了反而失效）
• href 必须和 import('./app.js') 或 <script type="module" src="..."> 中的路径完全一致，包括查询参数（如 ?t=123）
• 所有 modulepreload 标签必须出现在首个 type="module" 脚本之前，否则浏览器忽略
• 服务端返回 MIME 类型必须是 application/javascript，否则部分浏览器拒绝执行

真正容易被忽略的一点：prefetch 不执行任何代码，也不恢复任何状态。它只把文件丢进 HTTP 缓存——而 SPA 的性能瓶颈从来不在“JS 下载”，而在每次路由切换都重走一遍初始化流程。