[面試專題]Web緩存詳解

bladefury 發(fā)布于2019-08-01 17:30 / 2914人閱讀

摘要：緩存詳解標(biāo)簽空格分隔緩存緩存之于性能優(yōu)化請求更快通過將內(nèi)容緩存在本地瀏覽器或距離最近的緩存服務(wù)器如，在不影響網(wǎng)站交互的前提下可以大大加快網(wǎng)站加載速度。強(qiáng)制緩存不發(fā)請求到服務(wù)器，協(xié)商緩存會發(fā)請求到服務(wù)器。參考瀏覽器協(xié)議緩存機(jī)制詳解

Web緩存詳解

標(biāo)簽（空格分隔）：緩存

緩存之于性能優(yōu)化

請求更快：通過將內(nèi)容緩存在本地瀏覽器或距離最近的緩存服務(wù)器（如CDN），在不影響網(wǎng)站交互的前提下可以大大加快網(wǎng)站加載速度。

降低服務(wù)器壓力：在大量用戶并發(fā)請求的情況下，服務(wù)器的性能受到限制，此時將一些靜態(tài)資源放置在網(wǎng)絡(luò)的多個節(jié)點，可以起到均衡負(fù)載的作用，降低服務(wù)器的壓力。

緩存方式

服務(wù)端緩存,例如CDN

客戶端緩存,即瀏覽器緩存,可通過cache,manifest等實現(xiàn).

瀏覽器緩存分兩類,強(qiáng)制緩存和協(xié)商緩存

強(qiáng)制緩存:瀏覽器在加載資源時，根據(jù)http header判斷它是否命中強(qiáng)緩存，如果命中，瀏覽器直接從自己的緩存中讀取資源，不會發(fā)請求到服務(wù)器。比如某個css文件，如果瀏覽器在加載它所在的網(wǎng)頁時，這個css文件的緩存配置命中了強(qiáng)緩存，瀏覽器就直接從緩存中加載這個css，連請求都不會發(fā)送到網(wǎng)頁所在服務(wù)器.

協(xié)商緩存：當(dāng)強(qiáng)緩存沒有命中的時候，瀏覽器一定會發(fā)送一個請求到服務(wù)器，通過服務(wù)器端依據(jù)資源的另外一些http header驗證這個資源是否命中協(xié)商緩存，如果協(xié)商緩存命中，服務(wù)器會將這個請求返回（304），但是不會返回這個資源的數(shù)據(jù)，而是告訴客戶端可以直接從緩存中加載這個資源，于是瀏覽器就又會從自己的緩存中去加載這個資源；若未命中請求，則將資源返回客戶端，并更新本地緩存數(shù)據(jù)（200）。

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

強(qiáng)制緩存:Expires、Cache-control

協(xié)商緩存:Last-Modified/If-Modified-Since, Etag/If-None-Match

強(qiáng)制緩存控制

Expires,HTTP/1.0提出的一個表示資源過期時間的header，它描述的是一個絕對時間，由服務(wù)器返回，用GMT格式的字符串表示，如：Expires:Thu, 31 Dec 2016 23:55:55 GMT，Expires是較老的強(qiáng)緩存管理header，由于它是服務(wù)器返回的一個絕對時間，這樣存在一個問題，如果客戶端的時間與服務(wù)器的時間相差很大（比如時鐘不同步，或者跨時區(qū)），那么誤差就很大，所以在HTTP/1.1版開始，使用Cache-Control: max-age=秒替代。

Cache-Control描述的是一個相對時間，在進(jìn)行緩存命中的時候，利用客戶端時間進(jìn)行判斷，所以相比較Expires，Cache-Control的緩存管理更有效.
讀取緩存數(shù)據(jù)條件：上次緩存時間（客戶端的）+max-age < 當(dāng)前時間（客戶端的）.Cache-Control取值的含義:

各個消息中的指令含義如下：

no-cache指示請求或響應(yīng)消息不能緩存，該選項并不是說可以設(shè)置”不緩存“，而是需要和服務(wù)器確認(rèn)。

max-age指示客戶機(jī)可以接收生存期不大于指定時間（以秒為單位）的響應(yīng)。上次緩存時間（客戶端的）+max-age（64200s）<客戶端當(dāng)前時間

min-fresh指示客戶機(jī)可以接收響應(yīng)時間小于當(dāng)前時間加上指定時間的響應(yīng)。

協(xié)商緩存控制

Last-Modified/If-Modified-Since：
Last-Modified：標(biāo)示這個響應(yīng)資源的最后修改時間。web服務(wù)器在響應(yīng)請求時，告訴瀏覽器資源的最后修改時間。If-Modified-Since：當(dāng)資源過期時（強(qiáng)緩存失效），發(fā)現(xiàn)資源具有Last-Modified聲明，則再次向web服務(wù)器請求時帶上If-Modified-Since標(biāo)簽，把上次服務(wù)器返回的Last-Modified時間返回到服務(wù)器端。web服務(wù)器收到請求后根據(jù)If-Modified-Since 時間與被請求資源的最后修改時間進(jìn)行比對。若最后修改時間較新，說明資源又被改動過，則響應(yīng)整片資源內(nèi)容（寫在響應(yīng)消息包體內(nèi)），HTTP 200；若最后修改時間較舊，說明資源無新修改，則響應(yīng)HTTP 304 (無需包體，節(jié)省瀏覽)，告知瀏覽器繼續(xù)使用所保存的cache。

注: Last-Modified標(biāo)注的最后修改只能精確到秒級，如果某些文件在1秒鐘以內(nèi)，被修改多次的話，它將不能準(zhǔn)確標(biāo)注文件的修改時間（無法及時更新文件）
如果某些文件會被定期生成，當(dāng)有時內(nèi)容并沒有任何變化，但Last-Modified卻改變了，導(dǎo)致文件沒法使用緩存，有可能存在服務(wù)器沒有準(zhǔn)確獲取文件修改時間，或者與代理服務(wù)器時間不一致等情形（無法使用緩存）。

Etag/If-None-Match:
Etag：web服務(wù)器響應(yīng)請求時，告訴瀏覽器當(dāng)前資源在服務(wù)器的唯一標(biāo)識（生成規(guī)則由服務(wù)器決定）。Apache中，ETag的值，默認(rèn)是對文件的索引節(jié)（INode），大小（Size）和最后修改時間（MTime）進(jìn)行Hash后得到的。

If-None-Match：當(dāng)資源過期時（使用Cache-Control標(biāo)識的max-age），發(fā)現(xiàn)資源具有Etage聲明，則再次向web服務(wù)器請求時帶上頭If-None-Match （Etag的值）。web服務(wù)器收到請求后發(fā)現(xiàn)有頭If-None-Match 則與被請求資源的相應(yīng)校驗串進(jìn)行比對，決定返回200或304。
注:Etag是服務(wù)器自動生成或者由開發(fā)者生成的對應(yīng)資源在服務(wù)器端的唯一標(biāo)識符，能夠更加準(zhǔn)確的控制緩存。

上述緩存控制機(jī)制優(yōu)先級:
Expires < Cache:max-age
Last-Modified < ETag

CDN

CDN的全稱是Content Delivery Network，即內(nèi)容分發(fā)網(wǎng)絡(luò)。通過在網(wǎng)絡(luò)各處放置節(jié)點服務(wù)器所構(gòu)成的在現(xiàn)有的互聯(lián)網(wǎng)基礎(chǔ)之上的一層智能虛擬網(wǎng)絡(luò)，CDN系統(tǒng)能夠?qū)崟r地根據(jù)網(wǎng)絡(luò)流量和各節(jié)點的連接、負(fù)載狀況以及到用戶的距離和響應(yīng)時間等綜合信息將用戶的請求重新導(dǎo)向離用戶最近的服務(wù)節(jié)點上。其目的是使用戶可就近取得所需內(nèi)容，解決 Internet網(wǎng)絡(luò)擁擠的狀況，提高用戶訪問網(wǎng)站的響應(yīng)速度。

CDN是一個經(jīng)策略性部署的整體系統(tǒng)，包括分布式存儲、負(fù)載均衡、網(wǎng)絡(luò)請求的重定向和內(nèi)容管理4個要件，而內(nèi)容管理和全局的網(wǎng)絡(luò)流量管理(Traffic Management)是CDN的核心所在。通過用戶就近性和服務(wù)器負(fù)載的判斷，CDN確保內(nèi)容以一種極為高效的方式為用戶的請求提供服務(wù)。

參考:
瀏覽器 HTTP 協(xié)議緩存機(jī)制詳解