瀏覽器快取究竟有什麼作用呢？在這裡我將瀏覽器快取的作用簡單地歸結為以下幾點。
加快頁面開啟速度 降低伺服器壓力 減少網路損耗
瀏覽器快取有 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 ，鉤上就可以了，鉤上後瀏覽器會忽略掉文件過期驗證和伺服器再驗證的過程，直接向伺服器請求最新的資源。
