Ⅰ 瀏覽器緩存的作用是什麼
為了提高訪問網頁的速度，Internet Explorer瀏覽器會採用累積式加速的方法，將你曾經訪問的網頁內容（包括圖片以及cookie文件等）存放在電腦里。這個存放空間，我們就稱它為IE緩存。以後我們每次訪問網站時，IE會首先搜索這個目錄，如果其中已經有訪問過的內容，那IE就不必從網上下載，而直接從緩存中調出來，從而提高了訪問網站的速度。 設置IE緩存大小: 要提高IE的訪問速度，IE緩存是必不可少的。IE緩存默認安裝在系統區，而且會需要佔用較大的系統空間。所以如果你的系統空間的確很緊張，可以將緩存佔用的空間設得小一點，在IE的「工具」菜單下選擇「Internet選項」，然後在「常規」選項卡中你會看到有「Internet臨時文件」這一項，單擊「設置」按鈕，然後在彈出的「設置」對話框中將緩存大小設置為一個合適的值。你也可以直接將IE緩存移動到其它位置上去。 「Internet臨時文件」下單擊「設置」，然後在「設置」對話框中單擊「移動文件夾」按鈕，在「瀏覽文件夾」中選擇文件夾，將IE緩存移動到其他地方，這樣就不必擔心IE緩存太大，佔用更多空間了。
Ⅱ 電腦中瀏覽器緩存是什麼意思
瀏覽器緩存（Browser Caching）是為了加速瀏覽，瀏覽器在用戶磁碟上對最近請求過的文檔進行存儲，當訪問者再次請求這個頁面時，瀏覽器就可以從本地磁碟顯示文檔，這樣就可以加速頁面的閱覽。緩存的方式節約了網路的資源，提高了網路的效率。
瀏覽器緩存清楚記錄了你在電腦上上網記錄，有時漏隱私之舉。
如何清除上網留下的瀏覽器緩存：
1、自動清理IE緩存的方法:打開IE，選擇「工具--internet選項」，切換到「高級」選項卡，找到「關閉瀏覽器時清空internet臨時文件夾」，並將其選中，確定即可.
2、要清空 Mozilla Firefox 的緩存，請按以下步驟操作：
注銷您的 AdSense 帳戶。關閉所有其他打開的瀏覽器窗口。
單擊瀏覽器頂部的"Tools"（工具）菜單，並選擇"Options"（選項）。
單擊"Privacy"（隱私）。
單擊"Cache"（高速緩沖）旁邊的"Clear"（清空緩存）。
單擊"OK"（確定）。
3、要清空 Mozilla 和 Netscape 的緩存，請按以下步驟操作：
注銷您的 AdSense 帳戶。關閉所有其他打開的瀏覽器窗口。
單擊瀏覽器頂部的"Edit"（編輯）菜單，然後選擇"Preferences"（首選項）。
單擊"Advanced"（高級）旁邊的"+"。
單擊"Advanced"（高級）下面的"Cache"（高速緩存）。
單擊"Clear Cache"（清除高速緩存）。
單擊"OK"（確定）。
4、要清空 Safari 的緩存，請按以下步驟操作：
注銷您的 AdSense 帳戶。關閉所有其他打開的瀏覽器窗口。
打開瀏覽器工具欄中的"Safari"菜單。
選擇"Empty Cache"（清空緩存）。
單擊該對話框中的"Empty"（清空）。
某些情況下，可能需要多次清空您的緩存。
Ⅲ 瀏覽器緩存的方式和類型（筆記）
瀏覽器緩存只是計算機緩存的一種
1.內存緩存
將數據存到內存
2.代理伺服器緩存
就是個自己找的中介。你拿東西先找中介，中介找房東，房東給中介，中介又給你。比如你需要房子鑰匙，房東把鑰匙放在中介那，你直接從中介那裡拿鑰匙。
3.CDN緩存
將數據存到CDN伺服器。CDN也是個中介，不過這個中介是根據中介的忙碌程度（CDN伺服器忙碌程度）、跟你的距離（CDN伺服器和你的距離）自動給你分配的。
4.瀏覽器緩存（ 我是個前端，只關注瀏覽器緩存。 ）
根據HTTP協議決定要不要緩存，以什麼方式緩存，緩存到哪（內存還是硬碟等）。
瀏覽器緩存是將瀏覽器請求過的數據（資源文件）保存到電腦上。需要再次使用的時候，直接從電腦上獲取保存的數據（資源文件），這就是瀏覽器緩存
1.減少網路請求，節省流量
2.減輕伺服器壓力
3.資源載入速度快了，前端性能就更好了
1.Server Worker
還沒搞懂，搞懂了再來寫。
2.Memory Cache
內存中的緩存，關閉頁面進程就釋放內存
3.Disk Memory
硬碟中的緩存，不主動清理就一直在
4、Push Cache
推送緩存，是HTTP/2的內容，並沒有嚴格執行HTTP頭部的緩存指令。在Server Worker、Memory Cache、Disk Cache都沒有命中的時候，它會被使用。在Session中存在，Session結束就會被釋放，緩存時間短暫。
1.先去內存查找，找到直接載入
2.內存找不到，硬碟中找，找到直接載入
3.硬碟找不到進行網路請求
4.把請求獲取的資源再緩存到硬碟和內存
1.強緩存
控制強制緩存的欄位分別是Expires和Cache-Control，Cache-Control優先順序比Expires高
-Expires設置一個絕對時間的GMT格式的時間字元串，這個是資源失效時間（ 客戶端的時間小於Expires的值，缺陷就是客戶端的時間被改變就有問題 ），在這個時間之前都直接讀取緩存。
-Cache-Control替代Expires，它利用的是相對時間，利用header信息欄位的max-age值判斷。
2.協商緩存
-Last-Modified/If-Modified-Since
Last-Modified:瀏覽器向伺服器發送資源最後的修改時間
If-Modified-Since:當資源過期時，發現響應頭具有Last-Modified聲明，則再次向伺服器請求時帶上頭if-modified-since，表示請求時間。伺服器收到請求後，發現有if-modified-since則與被請求資源的最後修改時間進行對比（Last-Modified）,若最後修改時間較新，說明資源又被改過，則返回最新資源，返回200；若最後修改時間較小，說明資源無新修改，返回304 ，使用緩存文件。
缺點:單位是秒，一秒內多次改變會認為沒過期
-ETag/If-None-Match
ETag:由伺服器生成返回給前端，幫助伺服器控制web端的緩存驗證，伺服器會生成並且返回當前資源文件的一個唯一標識
If-None-Match:當資源過期時，發現響應頭具有Etag聲明，則再次向伺服器請求時帶上頭if-none-match（唯一標識Etag值）。伺服器收到該請求後，發現有If-None-Match則根據If-None-Match的欄位值與該資源在伺服器的Etag值做對比，一致則返回304，代表資源無更新，繼續使用緩存文件；不一致則重新返回資源文件，狀態碼為200。
1.強緩存不發請求，協商緩存會發請求給伺服器確認有沒有過期
2.強緩存文件更新瀏覽器不知道，協商緩存更新瀏覽器能實時知道
1.點擊瀏覽器的刷新按鈕時，全部走緩存
2.F5或者滑鼠右鍵刷新強制緩存失效，不影響協商緩存
3.CTRL+F5影響強制緩存和協商緩存都失效
Ⅳ ☆前端優化：瀏覽器緩存技術介紹
在前端開發中，性能一直都是被大家所重視的一點，然而判斷一個網站的性能最直觀的就是看網頁打開的速度。 其中提高網頁反應速度的一個方式就是使用緩存 。緩存技術一直一來在WEB技術體系中扮演非常重要角色，是快速且有效地提升性能的手段。
一個優秀的緩存策略可以縮短網頁請求資源的距離，減少延遲，並且由於緩存文件可以重復利用，還可以減少帶寬，降低網路負荷。
所以，緩存技術是無數WEB開發從業人員在工作過程中不可避免的一大問題。 在產品開發的時候我們總是想辦法避免緩存產生，而在產品發布之時又在想策略管理緩存提升網頁的訪問速度 。了解瀏覽器的緩存命中原理，是開發WEB應用的基礎，本文著眼於此，學習瀏覽器緩存的相關知識，總結緩存避免和緩存管理的方法，結合具體的場景說明緩存的相關問題。希望能對有需要的人有所幫助。
在實際WEB開發過程中，緩存技術會涉及到不同層、不同端，比如：用戶層、系統層、代理層、前端、後端、服務端等， 每一層的緩存目標都是一致的，就是盡快返回請求數據、減少延遲 ，但每層使用的技術實現是各有不同，面對不同層、不同端的優劣，選用不同的技術來提升系統響應效率。所以，我們首先看下各層的緩存都有哪些技術，都緩存哪些數據，從整體上，對WEB的緩存技術進行了解，如下圖所示：
本篇文章重點講的就是上面紅色框部分緩存內容。
當瀏覽器請求一個網站的時候，會載入各種各樣的資源，比如：HTML文檔、圖片、CSS和JS等文件。對於一些不經常變的內容，瀏覽器會將他們保存在本地的文件中，下次訪問相同網站的時候，直接載入這些資源，加速訪問。
那麼如何知曉瀏覽器是讀取了緩存還是直接請求伺服器？如下圖網站來做個示例：
第一次打開該網站後，如果再次刷新頁面。會發現瀏覽器載入的眾多資源中，有一部分size有具體數值，然而還有一部分請求，比如圖片、css和js等文件並沒有顯示文件大小，而是顯示了 from dis cache 或者 from memory cache 字樣。這就說明了，該資源直接從本地硬碟或者瀏覽器內存讀取，而並沒有請求伺服器。
瀏覽器啟用緩存至少有兩點顯而易見的好處： （1）減少頁面載入時間；（2）減少伺服器負載；
瀏覽器是否使用緩存、緩存多久，是由伺服器控制的 。准確來說，當瀏覽器請求一個網頁（或者其他資源）時， 伺服器發回的響應的「響應頭」部分的某些欄位指明了有關緩存的關鍵信息 。下面看下，HTTP報文中與緩存相關的首部欄位：
根據上面四種類型的首部欄位不同使用策略， 瀏覽器中緩存可分為強緩存和協商緩存 ：
當瀏覽器對某個資源的請求命中了強緩存時， 返回的HTTP狀態為200 ，在chrome的開發者工具的network裡面 size會顯示為from cache ，比如：京東的首頁里就有很多靜態資源配置了強緩存，用chrome打開幾次，再用f12查看network，可以看到有不少請求就是從緩存中載入的：
Expires是HTTP 1.0提出的一個表示資源過期時間的header，它描述的是一個絕對時間，由伺服器返回，用GMT格式的字元串表示 ，如：Expires:Thu, 31 Dec 2037 23:55:55 GMT，包含了Expires頭標簽的文件，就說明瀏覽器對於該文件緩存具有非常大的控制權。
例如，一個文件的Expires值是2020年的1月1日，那麼就代表，在2020年1月1日之前，瀏覽器都可以直接使用該文件的本地緩存文件，而不必去伺服器再次請求該文件，哪怕伺服器文件發生了變化。
所以， Expires是優化中最理想的情況，因為它根本不會產生請求 ，所以後端也就無需考慮查詢快慢。它的緩存原理，如下：
Expires是較老的強緩存管理header， 由於它是伺服器返回的一個絕對時間 ，在伺服器時間與客戶端時間相差較大時，緩存管理容易出現問題， 比如：隨意修改下客戶端時間，就能影響緩存命中的結果 。所以在HTTP 1.1的時候，提出了一個新的header， 就是Cache-Control，這是一個相對時間，在配置緩存的時候，以秒為單位，用數值表示 ，如：Cache-Control:max-age=315360000，它的緩存原理是：
Cache-Control描述的是一個相對時間 ，在進行緩存命中的時候， 都是利用客戶端時間進行判斷 ，所以相比較Expires，Cache-Control的緩存管理更有效，安全一些。
這兩個header可以只啟用一個，也可以同時啟用， 當response header中，Expires和Cache-Control同時存在時，Cache-Control優先順序高於Expires ：
此外，還可以為 Cache-Control 指定 public 或 private 標記。 如果使用 private，則表示該資源僅僅屬於發出請求的最終用戶，這將禁止中間伺服器（如代理伺服器）緩存此類資源 。對於包含用戶個人信息的文件（如一個包含用戶名的 HTML 文檔），可以設置 private，一方面由於這些緩存對其他用戶來說沒有任何意義，另一方面用戶可能不希望相關文件儲存在不受信任的伺服器上。需要指出的是，private 並不會使得緩存更加安全，它同樣會傳給中間伺服器（如果網站對於傳輸的安全性要求很高，應該使用傳輸層安全措施）。 對於 public，則允許所有伺服器緩存該資源 。通常情況下，對於所有人都可以訪問的資源（例如網站的 logo、圖片、腳本等）， Cache-Control 默認設為 public 是合理的 。
當瀏覽器對某個資源的請求沒有命中強緩存， 就會發一個請求到伺服器，驗證協商緩存是否命中，如果協商緩存命中，請求響應返回的http狀態為304並且會顯示一個Not Modified的字元串 ，比如你打開京東的首頁，按f12打開開發者工具，再按f5刷新頁面，查看network，可以看到有不少請求就是命中了協商緩存的：
查看單個請求的Response Header， 也能看到304的狀態碼和Not Modified的字元串，只要看到這個就可說明這個資源是命中了協商緩存，然後從客戶端緩存中載入的 ，而不是伺服器最新的資源：
【Last-Modified，If-Modified-Since】的控制緩存的原理，如下 ：
【Last-Modified，If-Modified-Since】都是根據伺服器時間返回的header，一般來說， 在沒有調整伺服器時間和篡改客戶端緩存的情況下，這兩個header配合起來管理協商緩存是非常可靠的，但是有時候也會伺服器上資源其實有變化，但是最後修改時間卻沒有變化的情況 ，而這種問題又很不容易被定位出來，而當這種情況出現的時候，就會影響協商緩存的可靠性。 所以就有了另外一對header來管理協商緩存，這對header就是【ETag、If-None-Match】 。它們的緩存管理的方式是：
Etag和Last-Modified非常相似，都是用來判斷一個參數，從而決定是否啟用緩存。 但是ETag相對於Last-Modified也有其優勢，可以更加准確的判斷文件內容是否被修改 ，從而在實際操作中實用程度也更高。
協商緩存跟強緩存不一樣，強緩存不發請求到伺服器， 所以有時候資源更新了瀏覽器還不知道，但是協商緩存會發請求到伺服器 ，所以資源是否更新，伺服器肯定知道。大部分web伺服器都默認開啟協商緩存，而且是同時啟用【Last-Modified，If-Modified-Since】和【ETag、If-None-Match】，比如apache:
如果沒有協商緩存，每個到伺服器的請求，就都得返回資源內容，這樣伺服器的性能會極差。
【Last-Modified，If-Modified-Since】和【ETag、If-None-Match】一般都是同時啟用，這是為了處理Last-Modified不可靠的情況。有一種場景需要注意：
比如，京東頁面的資源請求，返回的repsonse header就只有Last-Modified，沒有ETag：
協商緩存需要配合強緩存使用，上面這個截圖中，除了Last-Modified這個header，還有強緩存的相關header， 因為如果不啟用強緩存的話，協商緩存根本沒有意義 。
如果資源已經被瀏覽器緩存下來，在緩存失效之前，再次請求時，默認會先檢查是否命中強緩存，如果強緩存命中則直接讀取緩存，如果強緩存沒有命中則發請求到伺服器檢查是否命中協商緩存，如果協商緩存命中，則告訴瀏覽器還是可以從緩存讀取，否則才從伺服器返回最新的資源。其瀏覽器判斷緩存的詳細流程圖，如下：
Ⅳ 什麼是Web緩存
「web緩存,是指在用戶訪問網站後,在用戶客戶端留下的緩存。沒緩存的情況下,客戶端會對整站進行載入。有緩存的時候,會跳過已緩存的內容。
Ⅵ WEB緩存有什麼用
減少網路帶寬消耗。無論對於網站運營者或者用戶，帶寬都代表著金錢，過多的帶寬消耗，只會便宜了網路運營商。當Web緩存副本被使用時，只會產生極小的網路流量，可以有效的降低運營成本。
降低伺服器壓力。給網路資源設定有效期之後，用戶可以重復使用本地的緩存，減少對源伺服器的請求，間接降低伺服器的壓力。同時，搜索引擎的爬蟲機器人也能根據過期機制降低爬取的頻率，也能有效降低伺服器的壓力。
減少網路延遲，加快頁面打開速度。帶寬對於個人網站運營者來說是十分重要，而對於大型的互聯網公司來說，可能有時因為錢多而真的不在乎。那Web緩存還有作用嗎？答案是肯定的，對於最終用戶，緩存的使用能夠明顯加快頁面打開速度，達到更好的體驗。
Ⅶ 前端瀏覽器緩存機制
在前端開發中，性能是一個永恆的話題，沒有最好，只有更好。判斷一個網站性能好壞，一個直入眼觀的即是網頁的反應速度，有一個方式就是使用緩存，一個優秀的緩存策略可以縮短網頁請求的時間，減少延遲，並且網頁可以重復利用，還可以減少帶寬，降低網路負荷。
1： 為什麼需要緩存？
a：緩存可以減少用戶等待時間，提升用戶體驗
b：減少網路帶寬消耗
c：降低伺服器壓力
Note：緩存使用不當，也會造成『臟數據』問題
2：常見的緩存類型
強緩存 -
Expires伺服器端設置，表示該資源的過期時間，會有弊端，客戶端時間和伺服器時間不一致的問題。
Cache-Control：max-age表示緩存資源的最大生命周期，單位是秒
所以Expires 結合 Cache-Control 一起使用，大型網站中一般比較適用
協商緩存-
Last-Modified：值為資源的最後更新時間，隨伺服器response返回
If-Modified-Since：通過比較兩個時間來判斷資源在兩次請求期間是否有過修改，如果沒有，則命中協商緩存
Etag：表示資源內容的唯一標識，即資源的消息摘要
If-None-Match：伺服器通過比較請求頭中的If-None-Match與當前資源的Etag是否一致來判斷資源是否在兩次請求期間有過修改
3：緩存流程圖示：
a：瀏覽器會先檢測強緩存類型（Cache-Control 或者 Expires）是否有效；命中直接瀏覽器本地獲取緩存資源
b：未命中。伺服器會根據請求頭Request Header驗證這個資源是否命中協商緩存，稱之為HTTP二次驗證，命中，伺服器返回請求，但返回資源，而是告訴客戶端直接中直接從瀏覽器緩存中獲取
Note：
1.強緩存不會發生請求，協商緩存存在伺服器請求
2.當協商緩存也未命中時，則伺服器會將資源發送到客戶端
3.F5刷新頁面，會跳過強緩存
4.Ctrl+F5刷新頁面，跳過強緩存和協商緩存
5.不會緩存的情況
HTTPS POST請求 根據Cookie獲取認證信息 Request Header Cache-Control：no-cache， max-age=0
6.小故事大道理
上文對整個概念做了闡述，還是不夠形象，我們來通過幾個小故事生動理解一下：
故事一：Last-Modified
瀏覽器：Hi，我需要 jartto.min.js 這個文件，如果是在 Last-Modified: Fri Feb 15 2019 19:57:31 GMT 之後修改過的，請發給我。
伺服器：（檢查文件的修改時間）
伺服器：Oh，這個文件在那個時間之後沒有被修改過，你已經有最新的版本了。
瀏覽器：太好了，那我就顯示給用戶了。
故事二：ETag
瀏覽器：Hi，我需要 jartto.css 這個文件，有沒有不匹配 3c61f-1c1-2aecb436 這個串的
伺服器：（檢查 ETag…）
伺服器：Hey，我這里的版本也是 3c61f-1c1-2aecb436，你已經是最新的版本了
瀏覽器：好，那就可以使用本地緩存了
Ⅷ 網站緩存功能是什麼意思
提前下載後儲存在本地硬碟中
緩存的最根本的目的是為了提高網站性能,減輕頻繁訪問數據而給資料庫帶來的壓力.再進一步,合理的緩存了某種數據形式,還會減輕程序運算時,對CPU帶來的壓力.首先,我們要知道一個最基本的效率規則,操作內存中的數據比操作存放在硬碟上的數據是要快N個數量級的.操作簡單的文本結構的數據比操作資料庫中的數據快N個數量級.
目前緩存的做法分為兩種模式:
第一種模式是內存緩存,緩存數據存放在伺服器的內存空間中,這種模式的效率是最高的.這里要注意的是:每一個伺服器的資源都是有限的,盲目的把所有數據都加在到內存中,將可能會導致伺服器資源佔用過多,而造成Web服務失敗.
第二種模式就是文件緩存,緩存數據存放在伺服器的硬碟空間中.存放格式有很多種類,如:文本格式,XML格式,二進制格式等等.這里要注意的是,伺服器I/O的處理能力有限,當一次性讀取過大數據時(>1M),它並沒有想像中那麼的高效.這個時候就需要你有一個合理的文件結構來解決了.但這已經不在我們本次要講敘的內容範圍內了.
Ⅸ http緩存之基本概念
1. 重要性
綜上所述，所以大家很有必要花時間來研究。
2. 困難之處
個人認為http緩存是比較枯燥的理論知識，尤其對於前端來講，更多在於理解概念，以及內部緩存機制，而沒有什麼實踐可以鞏固，或者說理論和現實脫軌。
瀏覽器會在請求資源之後，根據自己的緩存策略判斷是否對資源進行緩存，當再次請求相同的資源時，瀏覽器根據緩存策略判斷是通過本地緩存獲取資源，還是重新向伺服器發起請求。
這個 緩存策略 到底是什麼呢？
實際每個瀏覽器的緩存策略是有差異的，但大致受以下幾個因素的影響。
搜索關鍵字 禁止 html 緩存 ，很容易搜到以下答案：
但是，這是 Html 4.0 中的規范，在 Html 5.0 的規范中 http-equiv 已經不存在以上屬性值了。
而且代理伺服器並不會讀取以上meta標簽，不利於代理伺服器的緩存。
-- 引用自 stackoverflow
綜上所述， html meta 是一個不那麼可靠，並且已經過時的解決方案，所以不建議再繼續使用 。
基於 HTTP 協議的緩存策略，分為 強緩存 和 協商緩存 , 由 HTTP 協議的首部 (Headers) 信息決定。具體的操作設置需要伺服器配合，比如 Nginx 。所以相對來說都是後端在做此類事情，前端接觸的機會比較少。
如果開啟了強緩存，並且在過期時間之內，則瀏覽器不再發起請求，直接使用本地的緩存資源。
Expires 和 Cache-control 用於控制強制緩存。
Expires 是 HTTP 1.0 的特性。通過指定一個明確的時間點作為緩存資源的過期時間，客戶端會根據此時間點來判斷到底使用本地緩存，還是向伺服器重新請求資源。
優點： 在緩存過期時間內，減少客戶端的 HTTP 請求，不僅節省了客戶端處理時間，提高了 web 應用的執行速度，而且減少了伺服器負載，以及客戶端網路資源的消耗。
缺點：指定的過期時間以伺服器為准，但是客戶端進行過期時間判斷時是將 本地的時間 與 指定的過期時間點 進行對比。如果客戶端修改了本地時間，將會影響對緩存的判斷。
Cache-control 是HTTP1.1 新增的特性，以便更精準地控制緩存。此首部信息 具有最高的優先順序。
max-age 指定的是緩存的時間跨度，而非緩存失效的時間點。優先順序比 Expires 高。
如果需要使用協商緩存，需要 將 Cache-control 指定為 no-cache 或者 max-age 、Expires 均過期之後。
協商緩存：瀏覽器本地是有緩存的，但是要先發起請求，由伺服器判斷緩存是否過期。
Last-Modified / If-Modified-Since
last-Modified 是 HTTP 1.0 的特性，是伺服器端在響應請求時用來說明資源的最後修改時間。
缺點：
Etag / If-None-Match
Etag 是 HTTP 1.1 的特性，是伺服器為資源分配的字元串形式唯一性標識，作為響應首部返回給瀏覽器。
採用弱比較，內容沒變化，時間變化了，會認為是資源未變化。
瀏覽器之HTTP緩存的那些事
304和瀏覽器http緩存
瀏覽器緩存機制剖析
瀏覽器緩存機制介紹
技術研究 vue項目的性能優化之路
HTTP緩存控制小結