說(shuō)到緩存大家肯定都不陌生盯荤，我們平時(shí)都已經(jīng)接觸過(guò)各種各樣的緩存(高速緩存馋吗，磁盤緩存，瀏覽器緩存....)秋秤，而它們都具有相同的屬性：降低開銷宏粤，提高速度
通過(guò)網(wǎng)絡(luò)獲取內(nèi)容既速度緩慢又開銷巨大。較大的響應(yīng)需要在客戶端與服務(wù)器之間進(jìn)行多次往返通信灼卢，這會(huì)延遲瀏覽器獲得和處理內(nèi)容的時(shí)間绍哎，還會(huì)增加訪問(wèn)者的流量費(fèi)用。因此鞋真，緩存并重復(fù)利用之前獲取的資源的能力成為性能優(yōu)化的一個(gè)關(guān)鍵方面崇堰。
好在每個(gè)瀏覽器都自帶了 HTTP 緩存實(shí)現(xiàn)功能。您只需要確保每個(gè)服務(wù)器響應(yīng)都提供正確的 HTTP 標(biāo)頭指令涩咖，以指示瀏覽器何時(shí)可以緩存響應(yīng)以及可以緩存多久海诲。
當(dāng)服務(wù)器返回響應(yīng)時(shí)，還會(huì)發(fā)出一組 HTTP 標(biāo)頭檩互，用于描述響應(yīng)的內(nèi)容類型特幔、長(zhǎng)度、緩存指令盾似、驗(yàn)證令牌等敬辣。例如，在上圖的交互中零院，服務(wù)器返回一個(gè) 1024 字節(jié)的響應(yīng)溉跃，指示客戶端將其緩存最多 120 秒，并提供一個(gè)驗(yàn)證令牌(“x234dff”)告抄，可在響應(yīng)過(guò)期后用來(lái)檢查資源是否被修改撰茎。
通過(guò) ETag 驗(yàn)證緩存的響應(yīng)
- 服務(wù)器使用 ETag HTTP 標(biāo)頭傳遞驗(yàn)證令牌。
- 驗(yàn)證令牌可實(shí)現(xiàn)高效的資源更新檢查：資源未發(fā)生變化時(shí)不會(huì)傳送任何數(shù)據(jù)打洼。
假定在首次獲取資源 120 秒后龄糊，瀏覽器又對(duì)該資源發(fā)起了新的請(qǐng)求逆粹。首先，瀏覽器會(huì)檢查本地緩存并找到之前的響應(yīng)炫惩。遺憾的是僻弹，該響應(yīng)現(xiàn)已過(guò)期，瀏覽器無(wú)法使用他嚷。此時(shí)蹋绽，瀏覽器可以直接發(fā)出新的請(qǐng)求并獲取新的完整響應(yīng)。不過(guò)筋蓖，這樣做效率較低卸耘，因?yàn)槿绻Y源未發(fā)生變化，那么下載與緩存中已有的完全相同的信息就毫無(wú)道理可言粘咖！
這正是驗(yàn)證令牌（在 ETag 標(biāo)頭中指定）旨在解決的問(wèn)題蚣抗。服務(wù)器生成并返回的隨機(jī)令牌通常是文件內(nèi)容的哈希值或某個(gè)其他指紋∥拖拢客戶端不需要了解指紋是如何生成的翰铡，只需在下一次請(qǐng)求時(shí)將其發(fā)送至服務(wù)器。如果指紋仍然相同唱捣，則表示資源未發(fā)生變化两蟀，您就可以跳過(guò)下載。
在上例中震缭，客戶端自動(dòng)在“If-None-Match” HTTP 請(qǐng)求標(biāo)頭內(nèi)提供 ETag 令牌赂毯。服務(wù)器根據(jù)當(dāng)前資源核對(duì)令牌。如果它未發(fā)生變化拣宰，服務(wù)器將返回“304 Not Modified”響應(yīng)党涕，告知瀏覽器緩存中的響應(yīng)未發(fā)生變化，可以再延用 120 秒巡社。請(qǐng)注意膛堤，您不必再次下載響應(yīng)，這節(jié)約了時(shí)間和帶寬晌该。
作為網(wǎng)絡(luò)開發(fā)者肥荔，您如何利用高效的重新驗(yàn)證？瀏覽器會(huì)替我們完成所有工作：它會(huì)自動(dòng)檢測(cè)之前是否指定了驗(yàn)證令牌朝群，它會(huì)將驗(yàn)證令牌追加到發(fā)出的請(qǐng)求上燕耿，并且它會(huì)根據(jù)從服務(wù)器接收的響應(yīng)在必要時(shí)更新緩存時(shí)間戳。我們唯一要做的就是確保服務(wù)器提供必要的 ETag 令牌姜胖。檢查您的服務(wù)器文檔中有無(wú)必要的配置標(biāo)志誉帅。
Cache-Control
- 每個(gè)資源都可通過(guò) Cache-Control HTTP 標(biāo)頭定義其緩存策略
- Cache-Control 指令控制誰(shuí)在什么條件下可以緩存響應(yīng)以及可以緩存多久。
從性能優(yōu)化的角度來(lái)說(shuō)，最佳請(qǐng)求是無(wú)需與服務(wù)器通信的請(qǐng)求：您可以通過(guò)響應(yīng)的本地副本消除所有網(wǎng)絡(luò)延遲蚜锨，以及避免數(shù)據(jù)傳送的流量費(fèi)用档插。為實(shí)現(xiàn)此目的，HTTP 規(guī)范允許服務(wù)器返回 Cache-Control 指令這些指令控制瀏覽器和其他中間緩存如何緩存各個(gè)響應(yīng)以及緩存多久亚再。
注：Cache-Control 標(biāo)頭是在 HTTP/1.1 規(guī)范中定義的郭膛，取代了之前用來(lái)定義響應(yīng)緩存策略的標(biāo)頭（例如 Expires）。所有現(xiàn)代瀏覽器都支持 Cache-Control氛悬，因此饲鄙，使用它就夠了。
Cache-Control取值
no-cache表示必須先與服務(wù)器確認(rèn)返回的響應(yīng)是否發(fā)生了變化圆雁，然后才能使用該響應(yīng)來(lái)滿足后續(xù)對(duì)同一網(wǎng)址的請(qǐng)求。因此帆谍，如果存在合適的驗(yàn)證令牌 (ETag)伪朽，no-cache 會(huì)發(fā)起往返通信來(lái)驗(yàn)證緩存的響應(yīng)，但如果資源未發(fā)生變化汛蝙，則可避免下載烈涮。
no-store則要簡(jiǎn)單得多。它直接禁止瀏覽器以及所有中間緩存存儲(chǔ)任何版本的返回響應(yīng)窖剑，例如坚洽，包含個(gè)人隱私數(shù)據(jù)或銀行業(yè)務(wù)數(shù)據(jù)的響應(yīng)。每次用戶請(qǐng)求該資產(chǎn)時(shí)西土，都會(huì)向服務(wù)器發(fā)送請(qǐng)求讶舰，并下載完整的響應(yīng)。
public表示則即使它有關(guān)聯(lián)的 HTTP 身份驗(yàn)證需了，甚至響應(yīng)狀態(tài)代碼通常無(wú)法緩存跳昼，也可以緩存響應(yīng)。大多數(shù)情況下肋乍，“public”不是必需的鹅颊，因?yàn)槊鞔_的緩存信息（例如“max-age”）已表示響應(yīng)是可以緩存的。
private表示瀏覽器可以緩存“private”響應(yīng)墓造，不過(guò)堪伍，這些響應(yīng)通常只為單個(gè)用戶緩存，因此不允許任何中間緩存對(duì)其進(jìn)行緩存觅闽。例如帝雇，用戶的瀏覽器可以緩存包含用戶私人信息的 HTML 網(wǎng)頁(yè)，但 CDN 卻不能緩存谱煤。
max-age指令指定從請(qǐng)求的時(shí)間開始摊求，允許獲取的響應(yīng)被重用的最長(zhǎng)時(shí)間（單位：秒）。例如，“max-age=60”表示可在接下來(lái)的 60 秒緩存和重用響應(yīng)室叉。
must-revalidate表示在使用一些老的資源前強(qiáng)制驗(yàn)證狀態(tài)判斷其是否過(guò)期睹栖。
參考資料：
https://developer.mozilla.org/zh-CN/docs/Web/HTTP/Caching_FAQ
https://developers.google.com/web/fundamentals/performance/optimizing-content-efficiency/http-caching?hl=zh-cn
