CACHE_NAME 忘了改 新版本为什么还在读旧预缓存

const CACHE = 'app-' + '20261114';
self.addEventListener('activate', e => {
  e.waitUntil(caches.keys().then(ks => Promise.all(
    ks.filter(k => k !== CACHE).map(k => caches.delete(k)))));
});

发了新版本，JS 文件名带的新 hash 也对，页面却仍在执行旧逻辑，Application 里同时存在 app-v3 和 app-v4 两个缓存。先别急着动参数，把报错原文和时间点记下来，顺序反了容易白折腾。

原因不复杂，sw.js 里 CACHE_NAME 还写着 app-v3，install 阶段判断同名缓存已存在就整段跳过，新资源根本没下载。activate 里也没有清理旧缓存，两版同时生效。

「缓存版本号未改」排查到最后往往是很小的一处差异，前面那些复杂猜测可以先放一放。动手前把原文件复制一份带时间戳，出问题立刻换回去，比现场分析快得多。

一次只改一处，改完立刻验证，几个改动叠在一起，出问题就说不清是谁导致的。先做最小复现，能稳定跑出来的问题，排查成本会低一个数量级。

处理上按这个顺序：每次发布把 CACHE_NAME 跟着构建号一起改，用构建时间戳最省事；activate 里遍历 caches.keys()，删掉不在白名单里的缓存；确认新 sw.js 真的被浏览器取到，再谈缓存清理。

改完只确认一件事：发布后 Application 里只剩一个新版本缓存，页面加载的是新 hash 的 JS 文件。