頁面性能測試

1、頁面性能測試概述

 

頁面性能測試則是針對於頁面性能優化而開展的一種性能測試，目的是對Web系統的頁面進行測試以確認系統頁面是否會影響系統的性能併爲頁面的優化提供依據與建議，最終提高系統的總體性能表現，提升用戶體驗滿意度。可見，Web系統頁面性能測試是相對Web系統後臺測試的另一種性能測試，是Web系統性能測試的一個重要部分。

 

2、頁面性能測試必要性

 

相對於C/S架構的應用系統，Web應用系統全部數據都須要從服務器端下載，雖然瀏覽器有緩存機制，但客戶每次訪問仍然須要下載大量的數據。特別是用戶對系統要求愈來愈高，除了要求功能完備，對界面的美觀、易用性也提出了更高的要求，越炫的頁面也就意味着頁面中要包含更多的腳本、樣式表、圖片和Flash，頁面的數據量也就越大，這對Web系統的性能提出了極大的挑戰。

 

曾經有個在線打印服務的應用提供商說他們的系統不須要關注系統性能問題，沒有必要進行性能測試，由於他們能夠購買足夠多的服務器來支撐系統；很多業界同行也認爲只要有足夠多的服務器資源，性能就不會存在問題。其實否則，他們都只關注到了應用系統的後臺性能表現，而忽略了頁面對系統總體性能的影響。舉個例子，當一個頁面中包含幾百個請求，頁面中沒有通過優化的javaScript文件、CSS 文件與圖片件大小達到10MB，即便當前只有一個用戶在訪問該系統，頁面的訪問速度也會慢得驚人，縱使增長再多的服務器也不見得會有明顯的性能提高。

 

可見，對Web應用系統的頁面進行性能測試和優化是很是有必要的。只有經過對頁面的性能測試，發現頁面存在的性能問題並根據性能測試結果進行頁面優化以提高頁面的加載性能，從而提高系統的總體性能。在應用系統高併發訪問時，更能體現出Web頁面優化後所帶來的系統總體性能提高效果。

 

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

 

● 減小請求和響應的往返次數

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

 

減小請求和響應的往返次數：

 

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

 

緩存相關的請求頭

 

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

 

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

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

 

二、發送一個有條件的HTTP請求到服務器，條件就是若是它不一樣於本地的緩存版本。

 

三、若是緩存的拷貝可用，就使用本地的緩存資源。

 

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

 

減小請求肯響應往返的字節大小：

 

一、使用更少的圖畫

二、將全部的CSS濃縮到一個CSS文件中

三、將全部的腳本濃縮到一個JS文件中

四、簡化你的頁時間

五、使用HTTP壓縮

 

第一種是經過HTTP代理的方式來截取客戶與服務器之間的通信。

 

此類的工具很是的多，如：

Charles官網：http://www.charlesproxy.com/

 

charles是一個HTTP代理/ HTTP監視器/使開發人員能夠查看全部的計算機和互聯網之間的HTTP和SSL/ HTTPS流量的反向代理。這包括請求，響應和HTTP標頭（其中包含的cookies和緩存信息）。

 

charles界面清爽，採用中國的瓷器爲logo，給人的感受簡潔高雅。並且使用也很是簡單。下載頁面：http://www.charlesproxy.com/download/ 進入選擇你適合你的版本，安裝也很是簡單，一路「next」就OK了。

 

點擊工具欄上的「紅色」按鈕，就自動的記錄你瀏覽器訪問的全部網站。

 

Fiddler2官網：http://www.fiddler2.com/fiddler2/

 

Fiddler是一個Web調試代理，記錄全部的HTTP（S）之間的計算機和互聯網的交通。提琴手容許您檢查交通，設置斷點，和「搗鼓」傳入或傳出數據。菲德勒包括一個強大的基於事件的腳本子系統，並可使用任何。NET語言擴展

Fiddler是免費軟件，能夠調試，從幾乎任何應用程序，支持代理，包括IE瀏覽器，谷歌Chrome，蘋果Safari，Mozilla Firefox中，歌劇，還有數千交通。您也能夠像Windows電話，iPod/ iPad和其餘流行的設備調試的交通。

 

Fiddler2相比Charles功能要更強大一些。固然了，若是單單把他們理解成頁面性能測試工具備此片面，尤爲Fiddlers2功能強大，固然了，我也沒有深究，在此就不過多評論了。

 

 

（本文轉載自網絡，感謝原文做者。  網址：http://mp.weixin.qq.com/s?__biz=MjM5Mjg0MzMzMw==&mid=400053415&idx=3&sn=d56f793e34495716b59eefcfce2a7d6c&scene=0#rd）