DIV CSS 佈局教程網

 DIV+CSS佈局教程網 >> 網頁腳本 >> WEB網站前端 >> 前端技巧 >> 浏覽器緩存相關http頭盡量減少http的請求次數
浏覽器緩存相關http頭盡量減少http的請求次數
編輯:前端技巧     
最近看雅虎黃金34條,學習下優化網站性能的方法。其中有一條:“為文件頭指定Expires或Cache-Control”,具體來說指對於靜態內容:設置文件頭過期時間Expires的值為“Never expire”永不過期;而對於動態內容:使用恰當的Cache-Control文件頭來幫助浏覽器進行有條件的請求。

這一條可以和雅虎34條的第一條聯系起來,那就是盡量減少http的請求次數(雅虎34條很多都是努力去減少http請求為目的的),畢竟如果有太多的資源需要下載需要新的http鏈接疊加起來的耗時是不容忽視的。所以可以利用緩存技術來對網站的性能加以優化,從而避免不必要的http請求。剛好可以順便整理下浏覽器相關的緩存技術和與緩存相關的http的頭:

1.Expires(過期時間):

HTTP頭信息Expires(過期時間) 屬性是HTTP控制緩存的基本手段,告訴浏覽器緩存保存的時間。過了這個時間,緩存器就會向源服務器發送請求,檢查文檔是否被修改。適用於設置靜態圖片文件等等,而且對於控制有規律改變的網頁也很有用,比如設置間隔固定的時間去更新等等;如果使用了Expires文件頭,當頁面內容改變時就必須改變內容的文件名。比如Yahoo經常使用這樣的步驟:在內容的文件名中加上版本號,如yahoo_2.0.6.js,從而能夠主動進行更新。

使用expires: 如果你使用的是Apache服務器,可以使用ExpiresDefault來設定相對當前日期的過期時間,使用mod_expires,在httpd.conf或者.htaccess中加上

復制代碼代碼如下:
<FilesMatch "\\.(ico|gif|jpg|html)$">ExpiresDefault "access plus 10 years"</FileMatch>

2.Cache-Control

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

1.Public指示響應可被任何緩存區緩存;
2.Private指示對於單個用戶的整個或部分響應消息,不能被共享緩存處理。這允許服務器僅僅描述當用戶的部分響應消息,此響應消息對於其他用戶的請求無效。
3.no-cache指示請求或響應消息不能緩存;
4.no-store用於防止重要的信息被無意的發布。在請求消息中發送將使得請求和響應消息都不使用緩存;
5.max-age指示客戶機可以接收生存期不大於指定時間(以秒為單位)的響應。
6.min-fresh指示客戶機可以接收響應時間小於當前時間加上指定時間的響應。
7.max-stale指示客戶機可以接收超出超時期間的響應消息。如果指定max-stale消息的值,那麼客戶機可以接收超出超時期指定值之內的響應消息;

舉例:

一般說來這種靜態文件永遠不應該過期,如果真的要給這個Cache加上一個期限,那我希望是 ——一萬年

即:“Cache-Control: max-age = 315360000000”

3.Last-Modified/If-Modified-Since
一問一答的模式,這邊問你更新了沒有,那邊回答,很容易理解;
4.配置ETag
Entity tags(ETags)(實體標簽)是web服務器和浏覽器用於判斷浏覽器緩存中的內容和服務器中的原始內容是否匹配的一種機制(“實體”就是所說的“內 容”,包括圖片、腳本、樣式表等)。增加ETag為實體的驗證提供了一個比使用“last-modified date(上次編輯時間)”更加靈活的機制。Etag是一個識別內容版本號的唯一字符串。唯一的格式限制就是它必須包含在雙引號內。原始服務器通過含有 ETag文件頭的響應指定頁面內容的ETag。例如:

HTTP/1.1 200 OK

Last-Modified: Tue, 12 Dec 2006 03:03:59 GMT
ETag: “10c24bc-4ab-457e1c1f”
Content-Length: 12195
稍後,如果浏覽器要驗證一個文件,它會使用If-None-Match文件頭來把ETag傳回給原始服務器。在這個例子中,如果ETag匹配,就會返回一 個304狀態碼,這就節省了12195字節的響應。

GET /i/yahoo.gif HTTP/1.1
Host: us.yimg.com
If-Modified-Since: Tue, 12 Dec 2006 03:03:59 GMT
If-None-Match: “10c24bc-4ab-457e1c1f”
HTTP/1.1 304 Not Modified

關於以上幾種緩存機制的優先級,在網上找到一種說法:

no-cache>Expires>Last-Modified

也就是講,最前面的最重要,前面的生效後,後面的基本就失效了
XML學習教程| jQuery入門知識| AJAX入門| Dreamweaver教程| Fireworks入門知識| SEO技巧| SEO優化集錦|
Copyright © DIV+CSS佈局教程網 All Rights Reserved