很多人，包括我自己，初看Service Worker多一個Cache Storage的時候，就感覺跟HTTP長緩存沒什么區別。
例如大家講的最多的Service Worker能讓網頁離線使用，但熟悉HTTP緩存的朋友，會發現，把整站所有資源設置為長緩存（不帶校驗），也可以實現離線使用。
那么，Service Worker在緩存方面和HTTP緩存比較，有什么好處呢？
帶着這個疑問，我翻閱了一些大神博客
JakeArchibald的《Caching best practices & max-age gotchas》
李熠的《設計一個無懈可擊的瀏覽器緩存方案：關於思路，細節，ServiceWorker，以及HTTP/2》
根據實際項目經驗，總結出以下。
Service worker除了針對PWA（推送和消息）以外，對普通web來說，在緩存方面，能比http緩存帶來一些額外的好處。
可以理解為，SW就是瀏覽器把緩存管理開放一層接口給開發者。
1、改寫默認行為。
例如，瀏覽器默認在刷新時，會對所有資源都重新發起請求，即使緩存還是有效期內，而使用了SW，就可以改寫這個行為，直接返回緩存。
2、緩存和更新並存。
要讓網頁離線使用，就需要整站使用長緩存，包括HTML。而HTML使用了長緩存，就無法及時更新（瀏覽器沒有開放接口直接刪除某個html緩存）。而使用SW就可以，每次先使用緩存部分，然后再發起SW js的請求，這個請求我們可以實施變更，修改HTML版本，重新緩存一份。那么用戶下次打開就可以看到新版本了。
3、無侵入式。
無侵入式版本控制。最優的版本控制，一般是HTML中記錄所有js css的文件名（HASH），然后按需發起請求。每個資源都長緩存。而這個過程，就需要改變了項目結構，至少多一個js或者一段js控制版本號，發起請求時還需要url中注入冬天的文件名。使用了SW，就可以把這部分非業務邏輯整合到sw js中。
無侵入式請求統計。例如緩存比例統計、圖片404統計。
4、額外緩存。
HTTP緩存空間有限，容易被沖掉。雖然部分瀏覽器實現SW的存儲也有淘汰機制，但多一層緩存，命中的概率就要更高了。
5、離線處理。
當監測到離線，而且又沒有緩存某個圖片時，可以做特殊處理，返回離線的提示。又或者做一個純前端的404/斷網頁面。類似Chrome的小恐龍頁面。
6、預加載資源。
這個類似prefetch標簽。
7、前置處理。
例如校驗html/JS是否被運營商劫持？js文件到了UI進程執行后，就無法刪除惡意代碼，而在SW中，我們可以當作文本一樣，輕松解決。當然，在HTTPS環境下出現劫持的概率是極低的。