预热非关键路由是有策略地缓存用户高频访问的二级、三级页面资源，如“个人资料”“帮助中心”等，在空闲时静默加载；通过 navigation preload 与运行时 message 触发动态 precache，配合软降级和版本化缓存管理确保体验流畅。
预热非关键路由不是让所有页面都提前加载，而是有策略地把用户大概率会访问的二级、三级页面资源，在空闲或低负载时悄悄缓存下来。这对复合型大型 SPA 很实用——首页秒开只是起点，用户点进“订单详情”“设置页”“帮助中心”这些非首屏路由时，也不该卡顿或白屏。
明确哪些路由算“非关键但高价值”
非关键不等于不重要，而是指：不参与首屏渲染、不阻塞主流程、但用户路径中出现频率高。比如：
- 用户登录后大概率打开的“个人资料”“消息通知”页
- 产品页中常被点击的“常见问题”“使用指南”弹窗对应路由（如
/help#faq） - 后台类应用里的“系统日志”“审计记录”等管理子页
- 电商中“收货地址管理”“发票信息”这类低频但操作链末端页面
用 Navigation Preload + 动态 precache 实现静默预热
不能在 install 阶段硬写一堆非核心 HTML 进缓存（体积大、更新难），而应结合导航预加载与运行时条件触发的精准缓存：
Skill Weave Chains — 技能链路由引擎
下载
开箱即用的技能链路由引擎。13 条预定义链覆盖搜索、开发、审查、MLOps、法律、创意等场景，三层路由架构（触发词→SAD反馈→DAG编排），recall@10=96.97%。配置驱动（chains.yaml），零代码扩展。pip install skill-weave-chains 一键安装。
- 注册 Service Worker 时立即启用导航预加载：
navigator.serviceWorker.register('/sw.js').then(r => r.navigationPreload.enable()) - 在主应用空闲时（例如首页加载完成 2 秒后、用户停留超过 5 秒、滚动停止 1.5 秒），调用自定义 API 触发预热请求：
navigator.serviceWorker.controller?.postMessage({ type: 'PREHEAT', routes: ['/settings', '/notifications'] }) - Service Worker 在 message 事件中接收指令，对目标路由发起 fetch 并存入专用缓存区（如
preheat-v1），注意只缓存静态资源（HTML 骨架、JS chunk、CSS），避开带用户态数据的接口响应
前端路由配合做“软降级”与命中提示
预热不是万能的，要让体验无缝：
- Vue Router / React Router 中，进入预热过的路由前，可先检查
caches.match(new Request('/settings'))是否存在有效响应，有则标记“已就绪”，UI 上取消 loading 动画 - 若缓存未命中，仍走正常网络请求，但 fallback 页面保持可用（比如一个轻量版 settings.html 静态页）
- 避免预热干扰主资源调度：所有预热请求设
priority: 'low'，且限制并发数（建议 ≤2），防止挤占首页资源带宽
缓存版本与清理机制必须闭环
非关键路由资源更新频繁，缓存过期逻辑比主包更敏感：
- 每个预热缓存区命名带时间戳或构建 hash，例如
preheat-20260523，避免跨版本污染 - activate 阶段自动清理 7 天前的 preheat 缓存，保留最多两个历史版本
- 监听
message事件支持手动清空指令：{ type: 'CLEAR_PREHEAT', cacheName: 'preheat-20260523' }，便于灰度发布或 AB 测试切换
