[前端 · 面試 ]HTTP 總結(七)—— HTTP 快取概述

程式設計三昧發表於2021-08-07

最近我在做前端面試題總結系列,感興趣的朋友可以新增關注,歡迎指正、交流。

爭取每個知識點能夠多總結一些,至少要做到在面試時,針對每個知識點都可以侃起來,不至於啞火。

HTTP 快取概述

前言

快取是應用程式中很重要的一個概念,在有大量資料交換的應用程式中,我們會採取一些方式將那些實時性要求不高的資料生成副本並儲存在某個相對來說可快速到達、訪問、獲取的倉庫,這樣在需要這些資料的時候我們直接從這個倉庫中獲取資料。

快取的目的主要有兩點:

  • 提升資料交換的效能(速度)
  • 提高使用者體驗
  • 減少網路傳輸
  • 緩解伺服器或資料庫的壓力

HTTP 快取作為 WEB 效能優化的重要手段,對於從事 Web 開發的同學們來說,應該是知識體系庫中的一個基礎環節,同時對於有志成為前端架構師的同學來說是必備的知識技能。

概念

HTTP 快取指的是: 當客戶端向伺服器請求資源時,會先抵達瀏覽器快取,如果瀏覽器有“要請求資源”的副本,就可以直接從瀏覽器快取中提取而不是從原始伺服器中提取這個資源。

常見的 HTTP 快取只能快取 GET 請求響應的資源,對於其他型別的響應則無能為力,所以後續說的請求快取都是指 GET 請求。

HTTP 根據是否要向伺服器傳送請求將快取規則分為了兩類:

  • 強快取
  • 協商快取

HTTP 快取都是從第二次請求開始的。

第一次請求資源時,伺服器返回資源,並在響應頭中回傳資源的快取引數;第二次請求時,瀏覽器判斷這些請求引數,命中強快取就直接200,否則就把請求引數加到請求頭中傳給伺服器,看是否命中協商快取,命中則返回 304,否則伺服器會返回新的資源。

快取規則

當使用者開始訪問一個網站時,瀏覽器會從目標伺服器獲取一些資源用以構建最終的 WEB 頁面,比如 css、js、html 等靜態檔案。

假設我們不採取任何措施,則使用者每次訪問這個網站都要發起一系列 HTTP 請求,試想,如果這個網站的 pv 達到上百萬甚至上千萬,會對網站的後臺伺服器造成多大的壓力。

為了儘可能提升網站的效能,HTTP 協議給出了一個優化方案,其大體規則如下圖所示:

image-20210807194116881

  • 當使用者第一次請求一個資源時的時序圖,瀏覽器會先詢問是否有命中快取
  • 沒有命中的快取則瀏覽器再從伺服器獲取資源並將資源放進快取倉庫中,下次則可以從快取中拿資源了。

為方便理解,我們認為瀏覽器提供了快取資料庫,只要瀏覽器發現滿足了某些快取規則,就可以直接從快取資料庫中取出你需要的資源。

上述是一個簡單過程,但是事實上的快取策略還要更復雜一點。下面是一個較為完整的快取流程:

HTTP 快取流程

總結

  • HTTP 快取是儲存在瀏覽器上的
  • HTTP 快取是應用程式效能優化的重要手段
  • HTTP 快取針對的是那些時效性不是很強的資源,比如 JS、CSS、HTML 等
  • HTTP 快取分為強快取和協商快取
  • HTTP 快取的相關設定引數都是在頭資訊中攜帶的

以上就是有關 HTTP 快取的概述內容,後面我會詳細講解強快取和協商快取的原理和應用。

~

~本文完,感謝閱讀!

~

學習有趣的知識,結識有趣的朋友,塑造有趣的靈魂!

大家好,我是〖程式設計三昧〗的作者 隱逸王,我的公眾號是『程式設計三昧』,歡迎關注,希望大家多多指教!

你來,懷揣期望,我有墨香相迎! 你歸,無論得失,唯以餘韻相贈!

知識與技能並重,內力和外功兼修,理論和實踐兩手都要抓、兩手都要硬!

本作品採用《CC 協議》,轉載必須註明作者和本文連結

相關文章