資訊專欄INFORMATION COLUMN
摘要：一認識瀏覽器緩存瀏覽器緩存分為強緩存和協商緩存。瀏覽器接收資源，把資源和相應頭緩存下來。協商緩存當瀏覽器判斷不是強緩存，就會發向服務器發請求，判斷是否是協商緩存。如果是，服務器會返回，瀏覽器從緩存中加載。
一、認識瀏覽器緩存
瀏覽器緩存分為：強緩存和協商緩存。
1、強緩存：瀏覽器加載資源時，第一步先判斷它是否是強緩存，如果是，瀏覽器將直接從自己的緩存中讀取，不會向服務器發送請求。
上圖，status200，Size是from memory cache就是走的強緩存。那么什么是強緩存呢？瀏覽器又是咋判斷的呢？
Expires字段：1、瀏覽器第一次向服務器請求，服務器返回資源并在response header加上Expires字段，是客戶端緩存有效期，是絕對時間。2、瀏覽器接收資源，把資源和相應頭緩存起來。3、待到再次請求這個資源時，先在緩存中找，找到了看Expires字段，判斷是否過期。若沒過期直接從緩存加載。若過期了，再向服務器請求。
但是絕對時間有時會有偏差，所以引出了Cache-Control。
Cache-Control字段：1、瀏覽器第一次向服務器請求，服務器返回資源并在response header加上Cache-Control字段，也是緩存的有效期，但是是相對時間，比如：Cache-Control:max-age=56700000。2、瀏覽器接收資源，把資源和相應頭緩存下來。3、待到瀏覽器再次請求這個資源時，先在緩存找，根據第一次的請求時間和Cache-Control相對時間算出過期時間。若沒過期，直接從緩存加載。若過期了，再向服務器請求。
Cache-Control彌補了Expires的不足，更安全有效。
2、協商緩存：當瀏覽器判斷不是強緩存，就會發向服務器發請求，判斷是否是協商緩存。如果是，服務器會返回304Not Modified，瀏覽器從緩存中加載。那什么又是協商緩存呢？
Last-Modified和If-Modified-Since字段：1、瀏覽器第一次向服務器發請求，服務器返回資源并在response header加上Last-Modified字段，表示資源最后修改的時間。2、瀏覽器再次請求這個資源時，請求頭會加上If-Modified-Since字段。若這兩個字段一樣，說明資源沒有修改過，返回304Not Modified，瀏覽器從緩存中獲取資源。若這兩個字段不一樣，說明資源修改過，服務器正常返回資源。
但有時候服務器上資源有變化，單最后修改時間沒更新，則引出下面兩個字段。
ETag、If-None-Match：1、瀏覽器第一次向服務器請求，服務器返回資源并在response header上加ETag字段。表示資源本身，資源有變化，則該字段有變化。2、瀏覽器再次向服務器請求這個資源時，請求頭攜帶If-None-Match字段。若這兩個字段相同，則代表資源沒有變化，服務器返回304Not Modified，瀏覽器從緩存中加載。若兩個字段不同，證明資源有變動，服務器正常返回資源。
文章版權歸作者所有，未經允許請勿轉載,若此文章存在違規行為，您可以聯系管理員刪除。
轉載請注明本文地址：http://specialneedsforspecialkids.com/yun/51639.html
摘要：一認識瀏覽器緩存瀏覽器緩存分為強緩存和協商緩存。瀏覽器接收資源，把資源和相應頭緩存下來。協商緩存當瀏覽器判斷不是強緩存，就會發向服務器發請求，判斷是否是協商緩存。如果是，服務器會返回，瀏覽器從緩存中加載。 一、認識瀏覽器緩存 瀏覽器緩存分為：強緩存和協商緩存。1、強緩存：瀏覽器加載資源時，第一步先判斷它是否是強緩存，如果是，瀏覽器將直接從自己的緩存中讀取，不會向服務器發送請求。上圖，s...
摘要：雖然如此，但是網站前端性能優化的思路基本沒變。為什么前端性能如此重要數據顯示只有的最終用戶響應時間花在了下載文檔上。前端性能優化一味奉行最佳實踐有時候反而過而不及，所以針對項目的實際情況來優化才是明智的選擇。 前端近幾年變化很大，各種工具，庫，框架并發。雖然如此，但是網站前端性能優化的思路基本沒變。為什么前端性能如此重要？數據顯示: 只有 10%~20% 的最終用戶響應時間花在了下載...
閱讀 1765·2021-09-22 15:10
閱讀 1261·2021-09-07 09:58
閱讀 2333·2019-08-30 15:44
閱讀 1635·2019-08-26 18:29
閱讀 2033·2019-08-26 13:35
閱讀 759·2019-08-26 13:31
閱讀 720·2019-08-26 11:42
閱讀 1065·2019-08-23 18:39
