首先緩存的優點是：緩解服務端壓力；快。

強緩存和協商緩存

強緩存是從本地緩存數據表中去取資源，不向服務端發送請求；協商緩存意思是每次使用緩存前都要和服務端進行確認。
從Response Header的Cache-Control的值看緩存規則（HTTP/1.1)：
max-age=xxx 過期時間（重要），過期了走協商緩存（expire是HTTP1.0的產物，采用絕對時間，已廢棄）
no-cache:不進行強緩存（重要），走協商緩存
no-store 不強緩存，也不協商緩存，基本不用
public：瀏覽器和代理服務器都可以緩存
private：資源只能給瀏覽器緩存，不能給代理服務器緩存
強緩存
強緩存步驟：

• 第一次請求 a.js ，緩存表中沒該信息，直接請求后端服務器。
• 后端服務器返回了 a.js ，且 http Response Header中 cache-control 為 max-age=xxxx，所以是強緩存規則，存入緩存表中。
• 第二次請求 a.js ，緩存表中是max-age， 那么命中強緩存，然后判斷是否過期，如果沒過期，直接讀緩存的a.js，如果過期了，則執行協商緩存的步驟了。

max-age=0和no-cache的區別：max-age是進行強緩存，但過期了，走協商緩存；no-cache是直接走協商緩存。兩者效果一樣。
協商緩存
協商緩存無論如何都是會向服務器發送請求的，只不過，資源未更改時，返回的只是header信息，所以size很小；而資源有更改時，還要返回body數據，所以size會大。
觸發條件：1，強緩存(max-age)過期；2，Cache-Control值為no-cache(不強緩存）
每次http返回來 response header 中的 (每個文件都有一個，改動文件時ETag會變）和 Last-Modified（文件的修改時間），在下次請求時在 request header 就把這兩個標識帶上（但是名字變了ETag–>If-None-Match，Last-Modified–>If-Modified-Since ），服務端把帶過來的標識，資源目前的標識，進行對比，然后判斷資源是否更改了。 如果資源沒更改，返回304，瀏覽器讀取本地緩存；如果資源有更改，返回200，返回最新的資源和最新的標識。

協商緩存步驟：


有了Last-Modified，為什么還要有ETag？
主要是為了解決幾個Last-Modified比較難解決的問題：

• 一些文件也許會周期性的更改，但是他的內容并不改變(僅僅改變了修改時間)，這個時候我們并不希望客戶端認為這個文件被修改了，而重新GET；
• 某些文件修改非常頻繁，比如在秒以下的時間內進行修改，(比方說1s內修改了N次)，Last-Modified能檢查到的粒度是s級的，這種修改無法判斷(或者說UNIX記錄MTIME只能精確到秒)；
• 某些服務器不能精確的得到文件的最后修改時間。

用戶行為對緩存的影響？
F5 會跳過強緩存規則，直接走協商緩存；Ctrl+F5 ，跳過所有緩存規則，和第一次請求一樣，重新獲取資源。

為什么很多站點第二次打開速度會很快？

如果第二次頁面打開很快，主要原因是第一次加載頁面過程中，緩存了一些耗時的數據。
那么，哪些數據會被緩存呢？從上面介紹的核心請求路徑可以發現，DNS 緩存和頁面資源緩存這兩塊數據是會被瀏覽器緩存的。DNS 緩存主要就是在瀏覽器本地把對應的 IP 和域名關聯起來。
簡要來說，很多網站第二次訪問能夠秒開，是因為這些網站把很多資源都緩存在了本地，瀏覽器緩存直接使用本地副本來回應請求，而不會產生真實的網絡請求，從而節省了時間。同時，DNS 數據也被瀏覽器緩存了，這又省去了 DNS 查詢環節。

如果一個頁面的網絡加載時間過久，你是如何分析卡在哪個階段的？

1 首先猜測最可能的出問題的地方，網絡傳輸丟包比較嚴重，需要不斷重傳。然后通過ping curl看看對應的時延高不高。
2 然后通過wireshake看看具體哪里出了問題。
3 假如別人訪問很快，自己電腦很慢，就要看看自己客戶端是否有問題了。

總結

以上是生活随笔為你收集整理的浏览器缓存Cache的全部內容，希望文章能夠幫你解決所遇到的問題。

如果覺得生活随笔網站內容還不錯，歡迎將生活随笔推薦給好友。