快取

本文主要探討記憶體快取、Service Worker 快取、HTTP 快取和 Push 快取。

發出 HTTP 請求後,會如何利用快取取得資源呢?

記憶體快取

瀏覽器經由 Preload 機制或先前的 HTTP 請求所取得的資源都會放在記憶體快取(Memory Cache)裡面並優先詢問,但文本(Document)生命週期結束時(例如:關閉瀏覽器或該頁籤)資料就會消失。

記憶體快取不管 HTTP Semantics 如何(例如:max-age=0 或 no-cache Cache-Control 標頭,但會在意 no-store),只核對想要取得的資源的 URL、檔案類型、CORS 模式和一些特性,就會將資源給予出去。

Service Worker 快取

只有當頁面安裝了 Service Worker,Service Worker 快取(Service Worker Cache)才會存在。Service Worker 快取對於資源提供的原則是由開發者撰寫的 JavaScript 程式碼而訂定的,並且資源的快取是永久的,不會因關閉瀏覽器或頁籤而消失。

HTTP 快取

HTTP 快取(HTTP Cache)又稱為磁碟快取(Disk Cache),永久保存資源,並且允許資源跨 session、跨站取用。HTTP 快取遵守 HTTP Semantics,只會提供新鮮的資源,並會重新驗證過期的資源、不儲存不應存的資源。當快取空間不夠的時候,就會把不重要或用不到的資源剔除。

備註:在 <link rel=prefetch> 或瀏覽器內部啟動機制之下取得的資源,由於需要保存這些資源以供之後瀏覽的頁面取用,HTTP 快取會保留五分鐘,且不理會 HTTP Semantics 的提示做重新驗證的工作。

之前提到記憶體快取在文本生命週期結束就消失了,因此瀏覽器同時也會將資源存放在磁碟快取中以作永久保存,這樣當無法從記憶體快取中取得時,至少可從磁碟快取拿到。

詳細說明可參考這篇

Push 快取

Push 快取(Push “Cache”)是 HTTP/2 儲存推送資源的地方,資源的保存不具永久性,只要 session 終止,資源就會被清除。

References


快取 Service Worker 效能調校 cache HTTP Caching 加載效能 Loading Performance 前端效能 系列文