DevTools Service Worker 调试
用 Application 面板调试 Service Worker 的注册、激活、更新、跳过等待和受控页面状态。
#type / concept
#status / growing
#tech / dev / frontend
#platform / browser
#resource / chrome-devtools
[!info] related notes
- 所属 MOC: DevTools Application MOC
- 前置概念: Service Worker 与 Cache API
- 并列概念: Service Worker 请求调试, IndexedDB 与 Cache Storage 调试
- 关系笔记: Application 面板, 缓存不更新排查路线
DevTools Service Worker 调试
一句话定义
Service Worker 调试是观察一个 SW 当前处于注册、等待、激活还是接管状态，以及它为什么没有按预期更新页面。
核心内容
常见检查点
- 是否成功注册
- 当前版本是否已激活
- 是否仍在 waiting
- 哪些页面被它控制
常见场景
- 发布后旧页面不更新
- 明明刷新了还是老资源
- 某些用户正常，某些用户一直卡旧版本
边界与易混淆点
- SW 生命周期和请求缓存命中是两个层次的问题
- 要区分“SW 没更新成功”和“SW 更新了但缓存策略仍返回旧资源”