2020前端面試(二) 瀏覽器快取機制篇

2021-10-10 01:31:40 字數 1101 閱讀 7559

點這裡,歡迎關注

3.2協商快取:

4.瀏覽器的快取機制:

5.實際場景中的快取策略應用:

瀏覽器的快取機制即是http的快取機制,因為其完全是由http來控制的。

service worker:單獨的乙個執行緒,用來實現快取功能;

memory cache:記憶體中的快取;容量小,儲存時間短;

disk cache:硬碟上的快取,容量大,時效性長;(絕大部分的快取都來自 disk cache,與http的快取策略有很大的關聯)

瀏覽器每次發起請求,都會先在瀏覽器快取中查詢該請求的結果以及快取標識。

如果找不到則向伺服器傳送請求,拿到請求結果後又會根據資源響應頭決定是否將該結果和快取標識存入瀏覽器快取中。

瀏覽器快取策略分為兩種:強快取和協商快取。都是由伺服器返回的響應報文中的頭字段決定的。

強快取:客戶端再次請求資源時,不會向伺服器傳送請求,而是直接從快取中讀取資源

兩種實現方式:

(1)expires方法(設定過期時間)

expires 是 http/1 的產物,表示快取資源到期的時間,如果系統的時間小於該時間,則不會傳送請求。

由於系統的時間是可以修改的,所以修改了時間的話不一定會滿足預期。

(2)cache-control方法(設定過期時間)

cache-control是http/1.1新增的字段,主要用於控制網頁快取。

expires 是http1.0的產物,cache-control是http1.1的產物。expires其實是過時的產物,現階段它的存在只是一種相容性的寫法。

兩者同時存在的話,cache-control優先順序高於expires;

協商快取:客戶端再次請求資源時時,會向伺服器傳送請求驗證當前資源的有效性

兩種實現方法:

(1)last-modified(根據檔案修改時間來決定是否從緩訪問資料)

(2)etag方法(根據檔案內容是否修改來決定是否從緩訪問資料)

(3)last-modified與etag兩者比較

參考鏈結

前端面試系列 瀏覽器快取機制

從快取位置上來說分為四種,並且各自有優先順序,當依次查詢快取且都沒有命中的時候,才會去請求網路 service workerservice worker 的快取與瀏覽器其他內建的快取機制不同,它可以讓我們自由控制快取哪些檔案 如何匹配快取 如何讀取快取,並且快取是持續性的.如果我們沒有在 servi...

2020前端面試(一) 瀏覽器渲染機制篇

點這裡,歡迎關注 外鏈轉存失敗,源站可能有防盜煉機制,建議將儲存下來直接上傳 img oa3fsg6i 1601978311602 在生成dom樹和cssom樹之後,會遍歷dom樹的每乙個可見的節點,對於每個可見的節點,找到cssom樹中對應的規則,然後組合在一起,最終生成一棵渲染樹。注意 渲染樹只...

前端面試之瀏覽器渲染

瀏覽器渲染的整個流程 瀏覽器的整個流程如上圖所示。1 首先當使用者輸入乙個url的時候,瀏覽器就會傳送乙個請求,請求url對應的資源。2 然後瀏覽器的html解析器會將這個檔案解析,並且構建成一棵dom樹。3 在構建dom樹的時候,遇到js和css元素,html解析器就換將控制權轉讓給js解析器或者...