對於前端快取的理解(快取機制和快取型別)

PANIC404 發表於 2020-06-01

前端快取,主要分為兩種,HTTP快取和瀏覽器快取。

HTTP快取,主要存在於伺服器請求傳輸時需要記錄的一些引數,在伺服器程式碼上設定。

瀏覽器快取,主要是由前端JS程式碼主動儲存的某些引數。

快取是前端專案效能優化中簡單高效的一種方式。優秀的快取策略可以縮短網頁請求資源的距離,減少延遲,並且由於快取檔案可以重複利用,還可以減少頻寬,降低網路負荷。例如:前端需要發起一個資料請求,可以分為發起網路請求、後端處理、瀏覽器響應三個步驟。瀏覽器快取可以幫助我們在第一和第三步驟中優化效能。比如說直接使用快取而不發起請求,或者發起了請求但後端儲存的資料和前端一致,那麼就沒有必要再將資料回傳回來,這樣就減少了響應資料。

對於前端快取的理解(快取機制和快取型別)

 

 

瀏覽器與伺服器通訊的方式為應答模式,即是:瀏覽器發起HTTP請求 – 伺服器響應該請求。那麼瀏覽器第一次向伺服器發起該請求後拿到請求結果,會根據響應報文中HTTP頭的快取標識,決定是否快取結果,是則將請求結果和快取標識存入瀏覽器快取中。

快取流程兩點總結:
1、瀏覽器每次發起請求,都會在瀏覽器快取裡尋找該請求的標識和快取內容。
2、瀏覽器每次收到返回結果,都會在瀏覽器快取裡儲存該標識和快取內容。
 
什麼叫強制快取?
   強制快取就是,強制從瀏覽器快取中查詢該次請求的標識和內容,然後根據該結果的快取規則,來決定是否使用瀏覽器快取。
(1)沒有該請求的快取和標識,強制快取失效,向伺服器傳送新請求。
(2)存在該請求的快取和標識,但是結果已過期,強制快取失效,改為協商快取。
(3)存在該請求的快取和標識,未過期,使用該快取資源,返回結果。
什麼叫協商快取?
   協商快取就是強制快取失效後,瀏覽器攜帶快取標識向伺服器發起請求,由伺服器根據快取標識決定是否使用快取的過程。此時的請求頭裡會有Etag引數,如果請求的Etag引數和伺服器上的Etag引數相同,那說明伺服器的資源沒有更新,則協商快取生效,繼續使用瀏覽器的快取資源,如果請求的Etag引數和伺服器的Etag引數不同,那說明伺服器的資源有更新,則協商快取不生效,由伺服器重新打包最新資源響應返回給瀏覽器。
 
強制快取和協商快取的優先順序?
強制快取優先於協商快取。