摘要:加快頁面打開速度降低服務器壓力減少網絡損耗瀏覽器緩存有標簽控制一般不用,所以本文不介紹與頭信息控制兩種。是服務器端在響應請求時用來規定資源是否需要被瀏覽器緩存以及緩存的有效時間等。
瀏覽器緩存究竟有什么作用呢?在這里我將瀏覽器緩存的作用簡單地歸結為以下幾點。
加快頁面打開速度
降低服務器壓力
減少網絡損耗
瀏覽器緩存有 HTML Meta 標簽控制(一般不用,所以本文不介紹)與 HTTP 頭信息控制兩種。
緩存標識字段便是 Expires 和 Cache-Control。
Expires? 是服務器端在響應請求時用來規定資源的失效時間。
Cache-Control 是服務器端在響應請求時用來規定資源是否需要被瀏覽器緩存以及緩存的有效時間等。
Expires 是 HTTP 1.0 的字段,而 Cache-Control? 是 HTTP 1.1 的字段,當 Expires? 與 ?Cache-Control 同時存在時,Cache-Control 的優先級要高于 ?Expires。
在瀏覽器緩存中,還保存了其它關于資源副本的描述字段,這些字段都是服務器返回信息頭帶過來的,如 Last-Modified 和 ETag。
Last-Modified 是服務器端在響應請求時用來說明資源的最后修改時間。與之對應的是 If-Modified-Since 字段。在服務器再驗證過程中,瀏覽器發送的 HTTP 請求的請求頭中會帶上 If-Modified-Since 字段,值為該資源 ?Last-Modified 屬性的值。
當服務器端接收到帶有 ?If-Modified-Since 屬性的請求時,則會將 If-Modified-Since 屬性的值與被請求資源的最后修改時間做對比。如果相同,說明資源沒有新的修改,則響應 HTTP 304,瀏覽器會繼續使用原先保存的該資源的副本;如果最后修改時間比較新,則說明資源被修改過,則響應 HTTP 200,并且返回最新的資源。
ETag 是服務器端在響應請求時用來說明資源在服務器端的唯一標識。與之對應的是 If-None-Match 字段。在服務器再驗證過程中,瀏覽器發送的 HTTP 請求的請求頭中會帶上 If-Modified-Since 字段,值為該資源 ?Etag 屬性的值。
當服務器端接收到帶有 ?If-None-Match 屬性的請求時,則會將 If-None-Match 屬性的值與被請求資源的唯一標識做對比。如果相同,說明資源沒有新的修改,則響應 HTTP 304,瀏覽器會繼續使用原先保存的該資源的副本;如果不同,則說明資源被修改過,則響應 HTTP 200,并且返回最新的資源。
那么當?Last-Modified / If-Modified-Since 和?Etag / If-None-Match 同時存在是什么情況呢?
事實上,當兩者同時存在時,Etag / If-None-Match 的優先級要高于?Last-Modified / If-Modified-Since
最后,雖然說瀏覽器緩存對用戶體驗有極大的好處,但是作為開發者,我們在開發的時候則需要禁止這「討厭」瀏覽器緩存,我的方法是打開瀏覽器的開發者工具,在 Network 中有個 Disable cache ,鉤上就可以了,鉤上后瀏覽器會忽略掉文檔過期驗證和服務器再驗證的過程,直接向服務器請求最新的資源。
文章版權歸作者所有,未經允許請勿轉載,若此文章存在違規行為,您可以聯系管理員刪除。
轉載請注明本文地址:http://specialneedsforspecialkids.com/yun/100065.html
摘要:我在工程實踐中直接使用類作為對應實體類的。因此我的結論是,此庫并不適用于我的工程實踐。工程實踐中對其應用方式的考慮在的官方教程中建議針對每請求創建新的實例,查詢請求結束則實例們的生命周期結束。 因為自己寫過基于react的前端應用,因此一看到GraphQL就被深深吸引,真是直擊痛點啊!服務端開發一直是基于java, Spring的,因此開始研究如何在現有工程框架下加入graphql的支...
摘要:在一個成熟的系統中,能夠運用到緩存的地方其實并不是一處。那么在以終端用戶為起點,系統所用的數據庫為終點的這條道路上可以作為緩存設立點的位置大致有以下這些。緩存也有一系列的副作用需要考慮。 如果這是第二次看到我的文章,歡迎文末掃碼訂閱我個人的公眾號(跨界架構師)喲~ 本文長度為3578字,建議閱讀10分鐘。堅持原創,每一篇都是用心之作~ 此前的「伸縮性」章節結束了,此文是「高性能」章...
摘要:第一階段基礎階段基礎程序員重點把搞熟練核心是安裝配置基本操作目標能夠完成基本的系統安裝,簡單配置維護能夠做基本的簡單系統的開發能夠在中型系統中支持某個功能模塊的開發。本項不做重點學習,除非對前端有興趣。 第一階段:基礎階段(基礎PHP程序員) 重點:把LNMP搞熟練(核心是安裝配置基本操作) 目標:能夠完成基本的LNMP系統安裝,簡單配置維護;能夠做基本的簡單系統的PHP開發;能夠在P...
摘要:如果沒有學習過計算機科學的程序員,當我們在處理一些問題時,比較熟悉的數據結構就是數組,數組無疑是一個很好的選擇。 showImg(https://segmentfault.com/img/bVTSjt?w=400&h=300); 1、常見 CSS 布局方式詳見: 一些常見的 CSS 布局方式梳理,涉及 Flex 布局、Grid 布局、圣杯布局、雙飛翼布局等。http://cherryb...
閱讀 1211·2021-09-03 10:44
閱讀 609·2019-08-30 13:13
閱讀 2801·2019-08-30 13:11
閱讀 1971·2019-08-30 12:59
閱讀 1037·2019-08-29 15:32
閱讀 1599·2019-08-29 15:25
閱讀 996·2019-08-29 12:24
閱讀 1285·2019-08-27 10:58