---
title: serviceworker配置优化版
description: 之前的文章介绍的缓存方案是白名单形式，只把需要缓存的内容列举出来进行缓存，这篇文章反向思考使用黑名单模式，黑名单里的不缓存，其他的都缓存。
author: chaihongjun
category: frontend
published: 2018-06-08
url: https://chaihongjun.me/frontend/16.html
---

# serviceworker配置优化版

之前的文章介绍的缓存方案是白名单形式，只把需要缓存的内容列举出来进行缓存，这篇文章反向思考使用黑名单模式，黑名单里的不缓存，其他的都缓存，一般不缓存的都是第三方域名下的跨域的资源，也无法缓存。

![e5871dd9d89130c4d42696576a40a84d.gif](https://chaihongjun.me/public/uploads/images/20240829/1724901825757187.gif)

延迟注册serviceworker(每个页面都要加载)：
MDBLOCK0
这个和之前的一样没有什么大的变化。

然后是serviceworker.js一定是放在网站发布目录的根目录，保证它的作用域最大化。具体的配置发生了变化：
MDBLOCK1
注意到上面的配置文件里面有提到一个离线文件offline.html,这里给出一个简单的版本：
MDBLOCK2

---

> 本文首发于 [chaihongjun.me | 柴宏俊 web 技术学习笔记](https://chaihongjun.me/frontend/16.html)，采用 CC BY-NC-ND 4.0 协议，转载请保留出处与链接。