資訊專欄INFORMATION COLUMN
摘要：緩存會根據進來的請求保存輸出內容的副本當下一個請求來到的時候，如果是相同的，緩存會根據緩存機制決定是直接使用副本響應訪問請求，還是向源服務器再次發送請求。同時，搜索引擎的爬蟲機器人也能根據過期機制降低爬取的頻率，也能有效降低服務器的壓力。
論，如何定義一個前端工程師。前天看了篇文章，作者把前端攻城獅稱作是所有攻城獅角色中最具有也最需要‘工匠精神’的攻城獅。從最直觀的角度來講就是視覺方面，不僅要百分百還原設計稿（靜態以及動態交互），還要考慮代碼是否工整、冗余、復用、性能等方面問題，而且說得更博大一些還要培養點產品和設計的思維（培養個P啊，這是開發和他們的鴻溝，純屬扯淡。）正兒八經的對于前端不只是會JavaScript就行了，要學的東西真是太多了，作為一名初生牛犢的我，還是相當有必要擴展下一個web開發要掌握的知識面，比如今天要總結的緩存機制。
Web緩存是指一個Web資源（如html頁面，圖片，js等）存在于Web服務器和客戶端（瀏覽器）之間的副本。緩存會根據進來的請求保存輸出內容的副本；當下一個請求來到的時候，如果是相同的URL，緩存會根據緩存機制決定是直接使用副本響應訪問請求，還是向源服務器再次發送請求。比較常見的就是瀏覽器會緩存訪問過網站的網頁，當再次訪問這個URL地址的時候，如果網頁沒有更新，就不會再次下載網頁，而是直接使用本地緩存的網頁。只有當網站明確標識資源已經更新，瀏覽器才會再次下載網頁。
減少網絡帶寬消耗
無論對于網站運營者或者用戶，帶寬都代表著金錢，過多的帶寬消耗，只會便宜了網絡運營商。當Web緩存副本被使用時，只會產生極小的網絡流量，可以有效的降低運營成本。
降低服務器壓力
給網絡資源設定有效期之后，用戶可以重復使用本地的緩存，減少對源服務器的請求，間接降低服務器的壓力。同時，搜索引擎的爬蟲機器人也能根據過期機制降低爬取的頻率，也能有效降低服務器的壓力。
減少網絡延遲，提升頁面渲染速度
帶寬對于個人網站運營者來說是十分重要，緩存的使用能夠明顯加快頁面打開速度，達到更好的體驗。
數據庫數據緩存：為了提供查詢數據庫表的性能，一般會將查詢后的數據放到內存中進行緩存，以便下次使用時直接從內存返回，提高響應效率
服務器端緩存：a.代理服務器緩存-瀏覽器端和源服務器之間的一個中間服務器，共享緩存，同一個副本會被重用多次，為大多用戶提供服務；b. CDN緩存（Content Delivery Network, 顧名思義，內容分發網絡），CDN和CDN緩存是兩個概念，切勿混淆，本篇文章談緩存。舉個例子，如果你要更新CDN上的資源，然后你把資源直接放到了CDN替換上邊的舊資源，文件名未修改（路經以及代碼未改），這時就很有可能造成頁面讀取舊緩存的情況出現，而這時倘若出現在線上......[淚奔-.-!!]，so ! 切記替換CDN資源時加個時間戳或是設置好請求報頭里的參數，避免飛來橫鍋。
瀏覽器緩存：這個就是常見在瀏覽器端的緩存，常用清除方法：控制臺-Application-Clear storage-選中Cache-Clear site data，Ctrl+F5（強制刷新），鼠標按住頁面刷新按鈕不放或按住滑動，會出現刷新選項（截不了圖sad）選項包括：正常重新加載 Ctrl + R || 硬性重新加載 Ctrl + shift + R || 清空緩存并硬性重新加載 ，不過我發現并不是所有的網站都可以，原因可能是部分站點設置的緩存不同（有待研究）。
web應用層緩存：這種緩存指的是代碼層面上，通過代碼邏輯和緩存策略實現對數據、頁面、圖片等資源的緩存。
本文要介紹的是瀏覽器緩存，其實就是指服務器和客戶端（瀏覽器）之間的一個副本（static sources like html/css/js）。一個完整的網絡請求大概是這樣的；
第一次請求： 客戶端發送請求 -> 本地無緩存 -> 向服務器發送請求 -> 返回靜態資源 -> 呈現（并緩存到本地）
第二次請求：如下圖一所示：
這里要先說下緩存中相關的消息報頭參數，具體如圖二（標紅處重點理解 ）：
現在講圖一中發生的第二次請求，此次請求會讀取本地的緩存副本，但首先讀取的時候瀏覽器會判斷緩存的過期時間（假如設置的話），倘若沒有過期就會讀取緩存。倘若過期就會和服務器校對ETag（Entity tag用于緩存驗證）如果ETag非空，瀏覽器就會把ETag的值給If-None-Match進行對比，同時，也會對比Last-Modified和If-Modified-Since的值，如果相同則證明服務器沒有修改內容，就會返回304 Not-Modified讀取本地緩存，HTTP304狀態碼是指該本地緩存資源與服務端資源相比沒有被修改過所以會直接讀取本地緩存內容，反之重新向服務器發出請求并返回。此時Last-Modified和ETag的值都會被重置。
以上所述都是自己總結的一些知識，如有錯誤還請指正，感謝。
感謝以下前輩的解惑，向大佬看齊【敬禮！】
http://www.alloyteam.com/2012...
https://segmentfault.com/a/11...
文章版權歸作者所有，未經允許請勿轉載,若此文章存在違規行為，您可以聯系管理員刪除。
轉載請注明本文地址：http://specialneedsforspecialkids.com/yun/61900.html
瀏覽器緩存機制學習總結 最近在做一個考試系統時，由于經常加載試卷或圖片等等靜態資源，抽空學習了一下緩存機制，在此記錄 為什么要使用緩存 1、通過HTTP協議，在客戶端和瀏覽器建立連接時需要消耗時間，而大的響應需要在客戶端和服務器之間進行多次往返通信才能獲得完整的響應，這拖延了瀏覽器可以使用和處理內容的時間。這就增加了訪問服務器的數據和資源的成本，因此利用瀏覽器的緩存機制重用以前獲取的數據就變成了性...
摘要：對于瀏覽器緩存，相信很多開發者對它真的是又愛又恨。那么瀏覽器緩存究竟是個什么樣的神奇玩意呢什么是瀏覽器緩存簡單來說，瀏覽器緩存就是把一個已經請求過的資源如頁面，圖片，，數據等拷貝一份副本儲存在瀏覽器中。 對于瀏覽器緩存，相信很多開發者對它真的是又愛又恨。一方面極大地提升了用戶體驗，而另一方面有時會因為讀取了緩存而展示了錯誤的東西，而在開發過程中千方百計地想把緩存禁掉。那么瀏覽器緩存究竟...
摘要：對于瀏覽器緩存，相信很多開發者對它真的是又愛又恨。那么瀏覽器緩存究竟是個什么樣的神奇玩意呢什么是瀏覽器緩存簡單來說，瀏覽器緩存就是把一個已經請求過的資源如頁面，圖片，，數據等拷貝一份副本儲存在瀏覽器中。 對于瀏覽器緩存，相信很多開發者對它真的是又愛又恨。一方面極大地提升了用戶體驗，而另一方面有時會因為讀取了緩存而展示了錯誤的東西，而在開發過程中千方百計地想把緩存禁掉。那么瀏覽器緩存究竟...
摘要：緩存緩存，也叫網關緩存反向代理緩存。瀏覽器先向網關發起請求，網關服務器后面對應著一臺或多臺負載均衡源服務器，會根據它們的負載請求，動態將請求轉發到合適的源服務器上。雖然這種架構負載均衡源服務器之間的緩存沒法共享，但卻擁有更好的處擴展性。 一、前言? 工作上遇到一個這樣的需求，一個H5頁面在APP端，如果勾選已讀狀態，則下次打開該鏈接，會跳過此頁面。用到了HTML5 的本地存儲 API ...
摘要：根據標準，到目前為止，一共有種緩存機制，有些是之前已有，有些是才新加入的。首次請求緩存有效期內請求緩存過期后請求一般瀏覽器會將緩存記錄及緩存文件存在本地文件夾中。 騰訊 Bugly 特約作者：賀輝超 1. H5 緩存機制介紹 H5，即 HTML5，是新一代的 HTML 標準，加入很多新的特性。離線存儲（也可稱為緩存機制）是其中一個非常重要的特性。H5 引入的離線存儲，這意味著 web ...
閱讀 3581·2023-04-26 02:55
閱讀 2849·2021-11-02 14:38
閱讀 4135·2021-10-21 09:39
閱讀 2842·2021-09-27 13:36
閱讀 3943·2021-09-22 15:08
閱讀 2643·2021-09-08 10:42
閱讀 2802·2019-08-29 12:21
閱讀 667·2019-08-29 11:22
