如何给你的网站加上离线能力：Workbox 上手指南

如何给你的网站加上离线能力Workbox 上手指南【免费下载链接】workbox Workbox: JavaScript libraries for Progressive Web Apps项目地址: https://gitcode.com/gh_mirrors/wo/workbox你的用户坐进电梯页面转了半圈就报错。他想看刚才没加载完的文章啥也点不开。Workbox 就是来干这个的帮你把 Web 应用做成 PWA断网能打开弱网不白屏离线缓存这套脏活它都包了。30 秒认识 WorkboxWorkbox 是一组面向 PWA 的 JavaScript 库主体用 TypeScript 和 JavaScript 写MIT 开源。它最早由 Google Chrome 的开发者关系团队做出来。现在已交给 Chrome 的 Aurora 团队接手维护README 里有专门的 Maintenance update 说明。一句话定位Service Worker 的注册、缓存、路由这些繁琐事它替你封装好了。它能帮你搞定哪些事当你需要断网也能打开应用时workbox-precaching 会在 Service Worker 安装时把核心文件提前存进缓存。像出门前把日用品全塞进行李箱落地就能用不挑网络。实现可以看 packages/workbox-precaching/。当你拿不准该先用缓存还是先问网络时workbox-strategies 给了一套现成策略CacheFirst、NetworkFirst、StaleWhileRevalidate 任你挑。把它当门卫就行你定规矩先看快递柜柜子里没有再打电话问。当用户断网时提交失败、回来又忘了重试时workbox-background-sync 会把没成功的请求排进队列存着网络恢复自动补发。像没送到的快递先放进驿站路通了再送。当你懒得自己拼缓存配置时workbox-recipes 直接给了 imageCache、pageCache、offlineFallback 这些现成配方照着用就行配方源码在 packages/workbox-recipes/。最近有什么新动静仓库里 17 个包现在统一在版本 7.4.1版本号全部同步你引哪个包都不用担心版本错位。README 的 Maintenance update 还说明了一件大事Workbox 的维护方已从早期的开发者关系团队换成 Chrome 的 Aurora 团队。仓库最新提交停在 2026 年 9 月以依赖维护为主。项目不激进但稳定。它适合你吗你在做 Web 应用想加离线或缓存又不想从零抠 Service WorkerWorkbox 值得放进依赖里。装一个试试npm install workbox-window workbox-precaching【免费下载链接】workbox Workbox: JavaScript libraries for Progressive Web Apps项目地址: https://gitcode.com/gh_mirrors/wo/workbox创作声明：本文部分内容由AI辅助生成（AIGC），仅供参考