一、瀏覽器緩存
Web 緩存能夠減少延遲與網絡阻塞，進而減少顯示某個資源所用的時間。借助 HTTP 緩存，Web 站點變得更具有響應性。
(一)、緩存優點：
- 減少不必要的數據傳輸，節省帶寬
- 減少服務器負擔，提升網站性能
- 加快客戶端加載網頁的速度，用戶體驗友好
(二)、緩存缺點：
- 服務端資源更新后，客戶端更新滯后
(三)、瀏覽器緩存主要有兩類：
- 強制緩存
- 協商緩存
(四)、強緩存與協商緩存的區別 如圖:
(五)、緩存機制原理:
瀏覽器第一次請求:
瀏覽器后續再進行請求時：
從上圖可以知道瀏覽器在第一次請求發生后，再次請求時：
- 瀏覽器在請求某一資源時，會先獲取該資源緩存的header信息，判斷是否命中強緩存（cache-control和expires信息），若命中直接從緩存中獲取資源信息，包括緩存header信息；本次請求根本就不會與服務器進行通信；
二、強緩存
不會向服務器發送請求，直接從緩存中讀取資源，請求返回狀態碼為 200.
強制緩存時，服務端會在 Response Headers 中的 cache-control 對緩存時間、緩存方式等進行定義，如下圖：
或者： 
cache-control 字段
cache-control: max-age=xxxx，public
- 客戶端和代理服務器都可以緩存該資源；
- 客戶端在xxx秒的有效期內，如果有請求該資源的需求的話就直接讀取緩存, statu code: 200
- 如果用戶做了刷新操作，就向服務器發起http請求
cache-control: max-age=xxxx，private
- 只允許客戶端可以緩存該資源；代理服務器不允許緩存
- 客戶端在xxx秒內直接讀取緩存, statu code: 200
cache-control: max-age=xxxx，immutable
- 客戶端在xxx秒的有效期內，如果有請求該資源的需求的話就直接讀取緩存, statu code:200
- 即使用戶做了刷新操作，也不向服務器發起http請求
cache-control: no-cache
- 跳過設置強緩存，但是不妨礙設置協商緩存；一般如果你做了強緩存，只有在強緩存失效了才走協商緩存的，設置了no-cache就不會走強緩存了，每次請求都回詢問服務端。
cache-control: no-store
- 不緩存，這個會讓客戶端、服務器都不緩存，也就沒有所謂的強緩存、協商緩存了。
補充：強制緩存在 header 中還有一個字段可以設置失效時間，即Expires，不過Expires 是HTTP 1.0的東西，現在默認瀏覽器均默認使用HTTP 1.1，所以它的作用基本忽略。
三、協商緩存
向服務器發送請求，服務器會根據這個請求的 Request Headers 的一些參數(etag 和 last-modified)來判斷是否命中協商緩存，如果命中，則返回 304 狀態碼, 並帶上新的 Request Headers 通知瀏覽器從緩存中讀取資源；
協商緩存主要表現在 Response Headers 中的 etag 和 last-modified：
etag
- 即文件hash，每個文件唯一
last-modified
- 文件的修改時間，精確到秒
注意:
Response Headers 中的 etag、last-modified 在客戶端重新向服務端發起請求時，會在 Request Headers 中換個key名：if-none-matched 和 if-modified-since
如下:
// Response Headers
etag: 65597c1615681857158408944e
last-modified: Wed, 11 Sep 2019 06:20:13 GMT
// Request Headers 變為
if-none-matched: 65597c1615681857158408944e
if-modified-since: Wed, 11 Sep 2019 06:20:13 GMT
兩種緩存的共同點：都從客戶端緩存中讀取資源；區別是強緩存不會向服務器發請求，協商緩存會發請求
四、操作行為對緩存的影響
