Cache API：版本治理与离线缓存策略

## 概述 Cache API 提供基于键值的请求/响应缓存。与 Service Worker 配合可在安装阶段预缓存与在激活阶段清理旧版本，保障离线与快速加载。 ## 用法/示例 ```js // sw.js const VERSION = 'v3' self.addEventListener('install', e => { e.waitUntil(caches.open(VERSION).then(c => c.addAll(['/','/app.js','/styles.css']))) }) self.addEventListener('activate', e => { e.waitUntil(caches.keys().then(keys => Promise.all(keys.filter(k => k !== VERSION).map(k => caches.delete(k))))) }) self.addEventListener('fetch', e => { e.respondWith(caches.match(e.request).then(r => r || fetch(e.request))) }) ``` ## 工程建议 - 对资源进行版本化与指纹，避免缓存混淆；在更新时提示用户刷新。 - 选择合适的缓存策略（缓存优先/网络优先/预取），按路由与资源类型区分。 - 审计缓存大小与命中率，定期清理与压缩，避免膨胀与过期数据。 ## 参考与验证 - MDN：Cache API — https://developer.mozilla.org/docs/Web/API/Cache - web.dev：Service Workers — https://web.dev/learn/pwa/service-workers