1. 程式人生 > >Web效能分析工具調研

Web效能分析工具調研

隨著網際網路時代的到來,網路使用者越來越多,如何對網站進行優化來提升效能從而改善使用者體驗變得越來越重要。這對開發者提出了新的挑戰。那麼,開發者如何判斷某個網站效能如何,是否需要優化?如果需要優化,網站的瓶頸在哪?需要對哪裡進行優化?這時,一款優秀的Web效能分析工具則顯得尤為重要。可以說Web效能分析工具是對網站進行效能優化的必備工具。目前有許多優秀的Web效能測試的工具,如WebPageTest、YSlow、HttpWatch、Page Speed、YCSB、HttpAnalyzer等。本文將主要對Web前端效能分析工具YSlow和雲端的常用效能分析工具YCSB進行詳細的介紹。

YSlow

YSlow是廣為人知的Web頁面效能分析、測試和除錯工具,是由Yahoo開發的基於網頁效能分析的瀏覽器外掛。YSlow最初只支援安裝在火狐瀏覽器的Firebug上,隨著著Yahoo對YSlow的不斷開發和維護,目前YSlow已經有很多版本了,可以支援FireFox、chrome、歐朋瀏覽器和歐朋移動版等眾多瀏覽器。現如今,YSlow已經成為業界的評價標準之一。

YSlow的主要功能包括:

基於三種預定義的規則集,或使用者自定義的規則集,為頁面打分

為頁面效能提升提供建議

總結頁面的元件情況

展示頁面統計資訊

提供效能分析輔助工具

網站評分和優化建議

雅虎曾經針對網站速度提出了非常著名34條準則:《Best Practices for Speeding UpYour Web Site》。而現在將34條精簡為更加直觀的23條,並針對每一條給出從F~A的評分以及最終的總分。現在23條網站效能優化建議在YSlow的官網首頁就能看到,在使用YSlow後,在控制面板裡就會給你評分提示和改進建議。這使得開發者對網站頁面效能進行評估變得非常方便。另外YSlow還允許使用者自己選擇定製優化準則集合,具有很高的靈活性。以下是Yahoo的經典23條優化準則:

1.        儘可能減少HTTP請求次數

2.        使用CDN

3.        避免空src和href標籤

4.        加入Expires或Cache-Control Header

5.        使用Gzip壓縮

6.        在html檔案頂部放置樣式表

7.        在html檔案底部放置JavaScript指令碼

8.        避免使用CSS表示式

9.        使用外部JavaScript和CSS外部檔案

10.    減少使用DNS查詢次數

11.    精簡JavaScript和CSS

12.    避免重定向

13.    移除重複的指令碼

14.    配置ETag

15.    快取AJAX

16.    使用GET完成AJAX請求

17.    減少DOM元素數量

18.    避免404

19.    減少Cookie大小

20.    使用無Cookie的域

21.    避免使用濾鏡

22.    不要在HTML中縮放圖片

23.    使用小favicon.ico檔案,並讓其可快取

利用YSlow的經典23條對百度首頁進行測評,結果圖1所示。左側是根據各個準則給出的評分,點選左側的各個標籤,可以看到對該項內容進行優化的建議。通過測試百度首頁可以看出,減少HTTP請求規則得分比較低。給出的建議是合併額外的JS和CSS等。

圖 1 YSlow測評百度首頁

元件情況

通過YSlow提供的檢視頁面總結的Components情況可以看出網頁各個元素佔用的空間大小。開發者可以根據各個元素大小,尋找可能的優化方式。

展示頁面統計資訊

YSlow還對頁面的資訊進行了統計,並以視覺化的方式展示了出來,非常直觀。圖2是對百度首頁測評的頁面統計資訊。

圖 2YSlow測評百度首頁的頁面統計資訊

效能分析輔助工具

YSlow還提供許多對Web前端網頁進行分析的輔助工具,如JSLint、ALL JS、ALL Smush.it™、All JS Beautified、All JSMinified等眾多的JS和CSS分析優化工具。為開發者優化頁面提供了更方便的工具。

從YSlow提供的主要功能可以看出,YSlow需要的引數只有待測的網頁網址和對網站進行評測時應用的規則集這兩部分。YSlow引數較少,用起來簡單,不需要太多的專業背景知識。同時,YSlow為開發者自動提供的優化建議,省去了許多開發者自己分析的工作。所以YSlow的優勢在於它簡單方便、實用、容易上手。

YCSB

YCSB(Yahoo!Cloud Serving Benchmark) 是雅虎開源的一款通用的效能測試工具,主要用在雲端或伺服器端的效能評測分析。YCSB用一個通用的負載框架來評估不同鍵值對儲存和雲端儲存的效能表現。

圖 3 YCSB結構

圖3是YCSB的機構圖,可以看成是一個數據庫客戶端。暗色的模組是可以替換的,Workload Executor是產生應用負載的,DBInterface Layer是將特定資料庫的API轉為YCSB的API,使用者可以自定義負載和資料庫。目前YCSB自帶了6種負載(workloads/目錄下),其中五種如表1所示。使用者可以自定義操作(read、update、insert和scan)的比例,以及選擇操作目標記錄的分佈:Uniform(等概率隨機選擇記錄)、Zipfian(隨機選擇記錄,存在熱紀錄)和Latest(近期寫入的記錄是熱記錄)。

表 1workloads in core package

通過這個工具我們可以對各類NoSQL產品進行相關的效能測試。比如大家所熟知的HBase、cassandra、mongodb、redis等等。用YCSB進行測試可以知道資料庫在併發寫入、讀取、更新時的一些指標,比如吞吐量、IO延遲等等。YCSB可以對多種不同的NoSQL進行測試,這裡我們用YCSB對HBase進行測試為例來討論它的優缺點。

YCSB與HBase自帶的效能測試工具(PerformanceEvaluation)相比,好處在於:

擴充套件:進行效能測試的客戶端不僅僅只是HBase一款產品,而且可以是HBase不同的版本。

靈活:進行效能測試的時候,可以選擇進行測試的方式:read+write,read+scan等,還可以選擇不同操作的頻度與選取Key的方式。

監控:

進行效能測試的時候,可以實時顯示測試進行的進度:

1340 sec: 751515operations; 537.74 current ops/sec; [INSERT AverageLatency(ms)=1.77]

1350 sec: 755945operations; 442.82 current ops/sec; [INSERT AverageLatency(ms)=2.18]

測試完成之後,會顯示整體的測試情況:

[OVERALL],RunTime(ms), 1762019.0

[OVERALL],Throughput(ops/sec), 567.5307700995279

[INSERT],Operations, 1000000

[INSERT],AverageLatency(ms), 1.698302

[INSERT],MinLatency(ms), 0

[INSERT],MaxLatency(ms), 14048

[INSERT],95thPercentileLatency(ms), 2

[INSERT],99thPercentileLatency(ms), 3

[INSERT],Return=0, 1000000

[INSERT], 0, 29

[INSERT], 1,433925

YCSB的不足在於:

自帶的workload模型還是過於簡單,不提供MR的形式進行測試,所以進行測試的時候如果希望開啟多執行緒的方式會比較麻煩。比如匯入的時候開啟多執行緒只能是啟動多個匯入程序,然後在不同的啟動引數中指定“開始Key的值”。在進行Transaction測試的時候,只能在多臺機器開啟多個執行緒來操作。

YCSB的主要引數有負載量、操作型別以及比例、操作目標記錄的分佈等。YCSB的這些引數可以根據需求人工自由配置,應用起來很是方便。

結論

很好的應用Web效能分析工具對於Web頁面的優化至關重要。可以省去很多人工檢測的勞動,使得優化事半功倍。YSlow和YCSB是目前非常主流的Web前端和雲端伺服器的效能優化工具。這兩款工具都具有簡單方便,靈活易用的特點,無論對初學者還是資深Web優化專業人士都是不錯的選擇。

參考文獻

[1]     Cooper B F, Silberstein A, Tam E, et al.Benchmarking cloud serving systems with YCSB[C]//Proceedings of the 1st ACMsymposium on Cloud computing. ACM, 2010: 143-154.

[2]     部落格http://lusongsong.com/reed/362.html

[4]     yahoo!YSlow官網http://developer.yahoo.com/yslow/

[5]     開源中國部落格http://my.oschina.net/fomy/blog/167659

部落格http://www.cnblogs.com/gpcuster/archive/2011/08/16/2141430.html