學習如何通過Fiddler建立一個速度更快的網站。在這篇文章中，我們將使用Fiddler去探究HTTP的性能，緩存，以及壓縮。

如果你要是沒有安裝和配置過Fiddler， 請從文章的第一篇開始。

?

HTTP性能總覽

毫無疑問用戶都喜歡訪問速度快的網站。用戶是非常的不耐煩，除非你的網站是沒有競爭對手，換句話就是處于壟斷地位的。如果你的訪問者來自世界各地，那你就必須要保證你的網站在執行效率方面要非常好，甚至要更加標準。作為一個國際化的網絡連接點，通常要受到來自兩個方面的壓力：高訪問量以及低帶寬。

?

在第一次至關重要的訪問中，用戶必須要下載每一個內容片斷，來生成頁面，包括JS，CSS，Images，HTML，如果你的頁面太難加載（包括IIS接到請求執行并返回給客戶端HTML），訪問者也許就會離開你的頁面！

通過暴露所有的HTTP通訊，Fiddler很容易得向你展示哪些文件經常被用于生成一個頁面，

Shift+click 可以在Fiddler左邊框的會話列表中多選會話，來計算那些被選會話的“頁面總重量”。那些被轉換成字節的數量。

?

如果你想讓你的客戶在第一次訪問的時候就留下深刻的印象 ，那么最好的，也是唯一的途徑就是返回給客戶更少的文件。

?

1 使用更少的圖畫

2 將所有的CSS濃縮到一個CSS文件中

3 將所有的腳本濃縮到一個JS文件中

4 簡化你的頁面時間

5 使用HTTP壓縮

?

如果要是你已經對用戶的第一次來訪的性能進行了優化，那么你可以通過Http 緩存的優勢來使得你的網站訪問速度更快！

?

HTTP 緩存介紹

?

2種方式來提升你的web 應用程序的速度：

減少請求和響應的往返次數

減少請求和響應的往返字節大小。

?

HTTP緩存是最好的減少客戶端服務器端往返次數的辦法。緩存提供了提供一種機制來保證客戶端或者代理能夠存儲一些東西，而這些東西將會在稍后的HTTP 響應中用到的。（即第一次請求了，到了客戶端，緩存起來，下次如果頁面還要這個JS文件或者CSS文件啥的，就不要到服務器端去取下來了，但是還是要去服務器上去訪問一次，因為請求要對比ETAG值，關于這個值，我將會在下次翻譯中介紹其作用）這樣，就不用讓文件再次跨越整個網絡了。

?

緩存相關的請求頭

?

為了提高性能，微軟的IE和其他的web客戶端總是想盡辦法來維持從遠程服務器上下載下來的本地的緩存。

當客戶端需要一個資源（html,css.js…），他們有3種可能的動作：

1 發送一個一般的HTTP請求到遠程服務器端，請求這個資源。

2 發送一個有條件的HTTP請求到服務器，條件就是如果它不同于本地的緩存版本。

3 如果緩存的拷貝可用，就使用本地的緩存資源。

?

當發送一個請求，客戶也許會使用如下的幾個HEADER

?

Table 1. Client Cache Headers

Pragma: no-cache	The client is unwilling to accept any cached responses from caches along the route and the origin server must be contacted for a fresh copy of the resource.
If-Modified-Since: datetime	The server should return the requested resource only if the resource has been modified since the date-time provided by the client.
If-None-Match: etagvalue	The server should return the requested resource if the ETAG of the resource is different than the value provided by the client. An ETAG is a unique identifier representing a particular version of a file.

?

1 Pragma：no-cache?? 表明客戶端不愿意接受緩存請求，它需要的是最即時的資源。

2 If-Modified-Since: datetime 表明如果這個資源自從上次被客戶端請求，就已經修改了，那么服務器就會返回給客戶端最新的。

3 If-None-Match: etagvalue 如果客戶端資源的ETAG值跟服務器端不一致了，那么服務器端返回最新的資源。ETAG就是一個唯一的ID，用來表示一個文件的一個特定的版本。

?

如果要是這些有條件的請求，也就是含有If-Modified-Since 或者 If-None-MatchHeader頭的請求，服務器將會以HTTP/304 Not Modified 來作為響應，那么客戶端就知道可以使用客戶端的緩存了。否則，服務器將會返回一個新的響應并且客戶端就會拋棄過期的緩存資源。

你可以觀察2個連貫的請求，來請求同一個圖片，你會在Fiddler中發現：在第一個本地緩存版本中，服務器返回一個含有ETAG的文件，和一個含有最后修改日期的文件，在這個第一次的請求會話中，一個本地的緩存版本已經可以使用了。這樣一來，一個有條件的請求就被創建出來。然后你再次請求這個圖片的時候，他就就會響應一個本地緩存的文件，當然前提是第一次緩存的圖片的ETAG值或者If-Modified-Since 值跟服務器上匹配的話，服務器就響應一個304給客戶端。

Session #1

?

GET /images/banner.jpg HTTP/1.1

Host: www.bayden.com

?

HTTP/1.1 200 OK

Date: Tue, 08 Mar 2006 00:32:46 GMT

Content-Length: 6171

Content-Type: image/jpeg

ETag: "40c7f76e8d30c31:2fe20"

Last-Modified: Thu, 12 Jun 2003 02:50:50 GMT

?

Session #2

?

GET /images/banner.jpg HTTP/1.1

If-Modified-Since: Thu, 12 Jun 2003 02:50:50 GMT

If-None-Match: "40c7f76e8d30c31:2fe20"

Host: www.bayden.com

?

HTTP/1.1 304 Not Modified

?

?

因為一個HTTP304響應僅僅包含頭，沒有body,所有它在穿越互聯網的時候要比攜帶了資源的快很多，盡管如此，HTTP/304響應需要一個服務器的往返，但是通過細心的設置響應頭，web程序員可以消除這種因素，甚至是有條件的請求。

緩存相關響應頭

?

通常緩存機制是由響應頭來控制的。HTTP規范描述了Header控制緩存，The optional Cache-Control，Expires（過期）。

Expires頭包含一個絕對的日期，當超過此日期，它將不會被考慮更新了。

?

Table 2. Common Cache-Control Headers

Value	Meaning
public	The response may be stored in any cache, including caches shared among many users.
private	The response may only be stored in a private cache used by a single user.
no-cache	The response should not be reused to satisfy future requests.
no-store	The response should not be reused to satisfy future requests, and should not be written to disk. This is primarily used as a security measure for sensitive responses.
max-age=#seconds	The response may be reused to satisfy future requests within a certain number of seconds.
must-revalidate	The response may be reused to satisfy future requests, but the origin server should first be contacted to verify that the response is still fresh.

Cache-Control頭的參數設置：

Public 響應會被緩存，并且在多用戶間共享。

Private 響應只能夠作為私有的緩存，不能再用戶間共享。

No-cache 響應不會被緩存

No-store 響應不會被緩存，并且不會被寫入到客戶端的磁盤里，這也是基于安全考慮的某些敏感的響應才會使用這個。

Max-age=#seconds 響應將會某個指定的秒數內緩存，一旦時間過了，就不會被緩存。

Must-revalidate 響應會被重用來滿足接下來的請求，但是它必須到服務器端去驗證它是不是仍然是最新的。

?

注意：

如果你要想在iis中配置緩存，請參閱溫軟的知識技術文章：

·????????????????? How to Modify the Cache-Control HTTP Header When You Use IIS.

你可以學習更多關于在asp.net中使用緩存的知識文章：

·????????????????? How To Cache in ASP.NET by Using Visual C# .NET.

如果你發現你經常在你的網站上更新文件，但是并沒有更改文件名字，那你就必須要非常小心地設置你的緩存生存時間。例如：如果你要一個thisyear.gif圖片文件顯示當前的年份在網站上，你需要保證這個緩存過期時間不能超過一天，否則一個用戶在12月31號訪問你的網站的時候，在1月1號就不能顯示正確的日期。

由于某些原因，服務器可能會設置：Progma：no-cache 頭，Cache-control:no-cache

Header中的參數：Vary 是一個緩存信號，Vary：User-Agent表示緩存當前的響應，但是僅限于當發送同樣的User-Agent 頭的時候。指令 Vary：* 就相當于Cache-Control：no-Cache。

Vary就相當于asp.net中的緩存的參數一樣，意思是根據什么來緩存，如果要是知道asp.net的緩存的使用方法，就很容易明白這個參數的意思。

?

使用HTTP會話列表，Fiddler用戶可以看到在頁面里包含的ＨＴＴＰ緩存頭。

?

Ｆｉｄｄｌｅｒ　會話列表

如果響應不包含Ｅｘｐｉｒｅｓ或者Ｃａｃｈｅ－Ｃｏｎｔｒｏｌ，那么客戶端就會被迫作為一個有條件的請求，來保證所有的資源都是最新的。

?

有條件的請求和ＷｉｎＩｎｅｔＣａｃｈｅ

ＩＥ通過Ｍｉｃｒｏｓｏｆｔ　ｗｉｎｄｏｗｓ　Ｉｎｔｅｒｎｅｔ　Ｓｅｒｖｉｃｅｓ來最大程度的利用緩存服務。ＷｉｎＩｎｅｔ允許用戶配置緩存的大小和行為，設置緩存進行如下操作：

１　打開ＩＥ，

２　工具選項，選擇Ｉｎｒｅｒｎｅｔ選項，在一般子選項中，臨時文件夾內，點擊設置

下圖就是選村的四種設置：

?

標記性能問題：

你可以使用Ｆｉｄｄｌｅｒ的自定義規則來標記某些你需要的，比如如果某個響應大于２５ＫＢ，你可以把當前的Ｓｅｓｓｉｏｎ標記為紅色，更加醒目。以下代碼都是在OnBeforeResponse事件中：

// Flag files over 25KB

?? if (oSession.responseBodyBytes.length > 25000){

????? oSession["ui-color"] = "red";

????? oSession["ui-bold"] = "true";

????? oSession["ui-customcolumn"] = "Large file";

?? }

同樣，你也可以標記響應并不指示緩存信息。

?? // Mark files which do not have caching information

if (!oSession.oResponse.headers.Exists("Expires") &&

!oSession.oResponse.headers.Exists("Cache-Control")){

?????

oSession["ui-color"] = "purple";

????? oSession["ui-bold"] = "true";

?? }

介紹ＨＴＴＰ壓縮

所有的目前流行的ＷＥＢ服務器和瀏覽器都提供ＨＴＴＰ壓縮支持。ＨＴＴＰ壓縮可以非常顯著地降低客戶端和服務器端的通訊量。節省超過５０％的ＨＴＭＬ，ＸＭＬ，ＣＳＳ，ＪＳ等文件。一個瀏覽器發送一個信號給服務器，他可以介紹ＨＴＴＰ壓縮過的內容，并且會把客戶端所支持的壓縮類型放在請求的Ｈｅａｄｅｒ中，例如：考慮如下的請求：

GET / HTTP/1.1

Accept: */*

Accept-Language: en-us

Accept-Encoding: gzip, deflate

User-Agent: Mozilla/4.0 (compatible; MSIE 6.0; Windows NT 5.1; SV1; .NET CLR 1.1.4322)

Host: search.msn.com

這個　Ａｃｃｅｐｔ－Ｅｎｃｏｄｉｎｇ　頭表明ＩＥ將愿意接受ＧＺＩＰ格式的和ＤＥＦＬＡＴＥ格式的壓縮響應。

相應的響應如下：

HTTP/1.1 200 OK

Content-Type: text/html; charset=utf-8

Server: Microsoft-IIS/6.0 --Microsoft-HTTPAPI/1.0

X-Powered-By: ASP.NET

Vary: Accept-Encoding

Content-Encoding: gzip

Date: Tue, 15 Feb 2006 09:14:36 GMT

Content-Length: 1277

Connection: close

Cache-Control: private, max-age=3600

?

你可以使用Ｆｉｄｄｌｅｒ來解壓縮這些數據。實驗表明，使用ＨＴＴＰ壓縮能大量減少數據往返，一個普通的ＣＳＳ文件甚至能減少８０％！當然壓縮是以犧牲ＣＰＵ性能為代價的。特別是壓縮動態文件，但是一般的權宜之策是壓縮例如ＪＳ，ＣＳＳ等靜態文件，因為他們在第一次壓縮后，就會被存儲在服務器上，如果要壓縮ａｓｐ．ｎｅｔ動態文件，一定要有個權衡才行

如果您現在還是不滿足您的程序優化，那么你還可以參看這篇文章，

Ten Tips for Writing High-Performance Web Applications

轉載于:https://www.cnblogs.com/FrameWork/archive/2006/10/16/530827.html

總結

以上是生活随笔為你收集整理的HTTP调试工具：Fiddler 介绍二的全部內容，希望文章能夠幫你解決所遇到的問題。

如果覺得生活随笔網站內容還不錯，歡迎將生活随笔推薦給好友。