欧美成人精品手机在线观看_69视频国产_动漫精品第一页_日韩中文字幕网 - 日本欧美一区二区

瀏覽器緩存--瀏覽器三級緩存

瀏覽器緩存--瀏覽器三級緩存_瀏覽器緩存用來干什么的-CSDN博客

一、什么是瀏覽器緩存

瀏覽器緩存就是將通過HTTP請求獲取的資源保存在本地的一種行為。瀏覽器對之前請求過的文件進(jìn)行緩存，以便再次訪問的時(shí)候提高頁面展示的速度。

緩存的好處

1、緩解服務(wù)器壓力，不用每次都去請求某些數(shù)據(jù)了。

2、提升前端性能，提高訪問速度，打開本地資源肯定會比請求服務(wù)器來的快。

3、減少帶寬消耗，當(dāng)我們使用緩存時(shí)，只會產(chǎn)生很小的網(wǎng)絡(luò)消耗。

（打開本地資源也會產(chǎn)生網(wǎng)絡(luò)消耗）

二、緩存的位置

瀏覽器緩存的位置一般為四類：Server Worker、Memory Cache、Disk Cache、Push Cache

1、Server Worker

Server Worker 是運(yùn)行在瀏覽器的獨(dú)立線程，一般用來緩存。Server Worker 涉及請求攔截，so傳輸協(xié)議是HTTPS來保障安全。

Server Worker 是“外建”的緩存機(jī)制，可以自由控制緩存哪些文件、如何匹配緩存、如何讀取緩存，并且緩存是持續(xù)性的，這是與其他內(nèi)建緩存機(jī)制的區(qū)別。

2、Memory Cache–內(nèi)存緩存

內(nèi)存中的緩存，主要包含的是當(dāng)前中頁面中已經(jīng)抓取到的資源，例如頁面上已經(jīng)下載的樣式、腳本、圖片等，占據(jù)該進(jìn)程一定的內(nèi)存資源，但是緩存持續(xù)性很短，會隨著進(jìn)程的釋放而釋放。一旦我們關(guān)閉 Tab 頁面，內(nèi)存中的緩存也就被釋放了。

內(nèi)存緩存特點(diǎn)：①讀取速度快 ②時(shí)效性：頁面關(guān)閉進(jìn)程的內(nèi)存清空釋放

3、Disk Memory–磁盤緩存

硬盤中的緩存。在所有瀏覽器緩存中，Disk Cache 覆蓋面基本是最大的，絕大部分的緩存都來自 Disk Cache。為什么呢？cuz根據(jù) HTTP Herder 中的字段判斷哪些資源需要緩存，哪些資源可以不請求直接使用，哪些資源已經(jīng)過期需要重新請求。在跨站點(diǎn)的情況下，相同地址的資源一旦被硬盤緩存下來，就不會再次去請求數(shù)據(jù)。

硬盤緩存比內(nèi)存緩存讀取速度慢，讀取需要對硬盤進(jìn)行I/O操作，會導(dǎo)致重新解析緩存內(nèi)容，造成讀取路的復(fù)雜。

4、Push Cache

推送緩存，是HTTP/2的內(nèi)容，并沒有嚴(yán)格執(zhí)行HTTP頭部的緩存指令。在Server Worker、Memory Cache、Disk Cache都沒有命中的時(shí)候，它會被使用。在Session中存在，Session結(jié)束就會被釋放，緩存時(shí)間短暫。

三、三級緩存原理 (訪問緩存優(yōu)先級)

1、先在內(nèi)存中查找，如果有，直接加載。

2、如果內(nèi)存中不存在，則在硬盤中查找，如果有直接加載。

3、如果硬盤中也沒有，那么就進(jìn)行網(wǎng)絡(luò)請求。

4、請求獲取的資源緩存到硬盤和內(nèi)存。

四、瀏覽器緩存的分類

1、強(qiáng)緩存

瀏覽器在加載資源時(shí)，會先根據(jù)本地緩存資源的 header 中的信息判斷是否命中強(qiáng)緩存，如果命中則直接使用緩存中的資源不會再向服務(wù)器發(fā)送請求并返回200。

在chrome控制臺的Network選項(xiàng)中可以看到該請求返回200的狀態(tài)碼，并且Size顯示from disk cache或from memory cache。強(qiáng)緩存可以通過設(shè)置兩種 HTTP Header 實(shí)現(xiàn)：Expires 和 Cache-Control。

(1)Expires

http1.0規(guī)范，它設(shè)置一個(gè)值絕對時(shí)間的GMT格式的時(shí)間字符串，這個(gè)是資源失效時(shí)間（客戶端的時(shí)間小于Expires的值），在這個(gè)時(shí)間之前都是名中緩存。

Expires:Mon,16 Oct 2066 23:59:59 GMT

1

缺陷：Expires控制緩存原理是客戶端的時(shí)間和服務(wù)端返回的時(shí)間作對比，若兩個(gè)時(shí)間偏差大的話，會造成強(qiáng)制緩存直接失效

(2)Cache-Control

http1.1規(guī)范，替代Expires，它利用的是相對時(shí)間，利用header信息字段的max-age值判斷。

max-age=5000//代表資源的有效期是5000秒

1

2、協(xié)商緩存

當(dāng)強(qiáng)緩存沒有命中的時(shí)候，瀏覽器會發(fā)送一個(gè)請求到服務(wù)器，服務(wù)器根據(jù) header 中的部分信息來判斷是否命中緩存。如果命中，則返回 304 ，告訴瀏覽器資源未更新，可使用本地的緩存。這里的 header 中的信息指的是 Last-Modify-------If-Modify-Since 和 ETag-------If-None-Match。

①Last-Modified

瀏覽器向服務(wù)器發(fā)送資源最后的修改時(shí)間

②If-Modified-Since

當(dāng)資源過期時(shí)，發(fā)現(xiàn)響應(yīng)頭具有Last-Modified聲明，則再次向服務(wù)器請求時(shí)帶上頭if-modified-since，表示請求時(shí)間。服務(wù)器收到請求后，發(fā)現(xiàn)有if-modified-since則與被請求資源的最后修改時(shí)間進(jìn)行對比（Last-Modified）,若最后修改時(shí)間較新，說明資源又被改過，則返回最新資源，返回200；若最后修改時(shí)間較小，說明資源無新修改，返回304 ，使用緩存文件。

③ETag

http1.1屬性，由服務(wù)器生成返回給前端，幫助服務(wù)器控制web端的緩存驗(yàn)證，服務(wù)器會生成并且返回當(dāng)前資源文件的一個(gè)唯一標(biāo)識

④If-None-Match

當(dāng)資源過期時(shí)，發(fā)現(xiàn)響應(yīng)頭具有Etag聲明，則再次向服務(wù)器請求時(shí)帶上頭if-none-match（唯一標(biāo)識Etag值）。服務(wù)器收到該請求后，發(fā)現(xiàn)有If-None-Match則根據(jù)If-None-Match的字段值與該資源在服務(wù)器的Etag值做對比，一致則返回304，代表資源無更新，繼續(xù)使用緩存文件；不一致則重新返回資源文件，狀態(tài)碼為200。

緩存機(jī)制

強(qiáng)制緩存優(yōu)先于協(xié)商緩存進(jìn)行，若強(qiáng)制緩存(Expires和Cache-Control)生效則直接使用緩存，若不生效則進(jìn)行協(xié)商緩存(Last-Modified / If-Modified-Since和Etag / If-None-Match)，協(xié)商緩存由服務(wù)器決定是否使用緩存，若協(xié)商緩存失效，那么代表該請求的緩存失效，返回200，重新返回資源和緩存標(biāo)識，再存入瀏覽器緩存中；生效則返回304，繼續(xù)使用緩存。具體流程如下。

If-Modify-Since：實(shí)際上就是上次返回資源的時(shí)間戳

**If-None-Match：**用來判斷請求頭中的If-None-Match是否等于響應(yīng)頭中的 ETag，判斷資源是否相同。

Cache-Control:

Etag

瀏覽器中的 ETag（實(shí)體標(biāo)簽）是一種用于Web資源的HTTP響應(yīng)標(biāo)識符。它是由服務(wù)器分配的，并且在資源的內(nèi)容發(fā)生變化時(shí)會更新。瀏覽器使用 ETag 來檢查資源是否已經(jīng)更改，以決定是否需要重新請求該資源或者直接使用緩存版本。

當(dāng)瀏覽器請求一個(gè)資源時(shí)，服務(wù)器會在響應(yīng)的頭部包含 ETag 值。瀏覽器將該值存儲在緩存中，然后在后續(xù)請求中將其發(fā)送給服務(wù)器。服務(wù)器使用收到的 ETag 來檢查資源是否與客戶端緩存的相同（請求頭中的If-None-Match是否等于響應(yīng)頭中的 ETag）。如果資源沒有改變，服務(wù)器將返回一個(gè)指示資源未修改的狀態(tài)碼，并且瀏覽器可以使用緩存中的副本，從而減少網(wǎng)絡(luò)流量和加快頁面加載速度。

總結(jié)

強(qiáng)緩存和協(xié)商緩存的區(qū)別

①強(qiáng)緩存不發(fā)送請求到服務(wù)器，協(xié)商緩存發(fā)送請求到服務(wù)器

②強(qiáng)緩存資源更新瀏覽器不知道，因?yàn)闆]有發(fā)送請求到服務(wù)器；協(xié)商緩存資源更新瀏覽器都知道，因?yàn)榘l(fā)送了請求到服務(wù)器

③大部分web默認(rèn)用協(xié)商緩存

刷新對強(qiáng)緩存和協(xié)商緩存的區(qū)別

①當(dāng)ctrl+f5強(qiáng)制刷新網(wǎng)頁時(shí)，直接從服務(wù)器加載，跳過強(qiáng)緩存和協(xié)商緩存

②當(dāng)f5刷新網(wǎng)頁時(shí)，跳過強(qiáng)緩存，檢查協(xié)商緩存

③瀏覽器地址欄中寫入U(xiǎn)RL，不用請求直接走緩存，最快的速度

瀏覽器再次訪問一個(gè)資源

①看是否命中強(qiáng)緩存，命中使用強(qiáng)緩存

②沒有命中強(qiáng)緩存，發(fā)送請求到服務(wù)器看是否命中協(xié)商緩存

③若命中協(xié)商緩存，服務(wù)器返回304告訴瀏覽器可以使用本地緩存

④沒有命中協(xié)商緩存，返回最新的資源,返回200