前端性能測試入門

　　性能測試一直是 Web 應用中非常受關注的部分。目前大多數人對性能的關注還主要集中在服務端，大部分人在說到“性能測試”的時候，都會把重點放到服務端的性能測試和調優，也就是通過各種方法找到服務端的性能瓶頸并嘗試對其進行調優。但實際上，對于 web 應用來說，除了考慮服務端在足夠短的時間內返回頁面數據之外，還可以從頁面 前端 的角度來考慮性能測試和性能調優。

　　目前，前端性能測試的執行工具也有很多，比如YSlow，Page Speed，dynaTrace AJAX Edition，webload等等。這些執行工具都很好使用，并且這些關注的性能點還有些不同，所以就有了將這些工具產生的數據都收集起來的工具，showslow。通過部署和匹配showslow，可以實現將上述工具產生的數據收集并產生不錯的報表。

　　當然我們可以直接先使用showslow在線的服務，體驗一下這種報表的強大。見下面的圖:

　　現在的一些思路：

　　1. 我們需要測試的url可能會比較多，所有每次都手動添加刷新不太靠譜，所有需要做成自動化的，可以使用pwatir，selenium

　　2. 安裝執行插件：Firebug，YSlow ，pagespeed，dynatrace。

　　3. 搭建一個showslow，用于收集數據生成報表，報表如附上的圖所示。

　　附上一些指標以及說明：

　　前端性能指標：

　　1. Dynatrace時間：

　　1、首次顯示時間(Time to First Impression)：在瀏覽器地址欄輸入URL按回車到用戶看到網頁的第一個視覺標志為止。

　　2、onLoad事件時間(Time to onLoad Event)：這個時間是直到瀏覽器觸發onLoad事件的時間，當原始文檔和所有引用的內容完全下載后才會觸發這個事件

　　3、完全載入的時間(Time to Fully Loaded)：等于直到所有onLoad JavaScript 處理程序執行完畢，所有動態的或延遲加載的內容都通過這些處理程序觸發的時間

　　2. 頁面大?。?組成頁面的所有資源總大小，圖像/css/js的大小也可以單獨成為一個指標。

　　3. 請求數量： 從網站下載資源時所有網絡請求的總數，盡量少。

　　4. 網絡方面的指標(yslow中的一些指標的意義)：

　　1、DNS時間：托管網站資源的每個域名都會發生一次DNS查找，如果你在多個網頁之間移動，當前一個頁面已經請求過一次DNS查找后，瀏覽器不會再對同一個域名請求另一個DNS查找，但通過查看總體DNS時間，可以確定是否存在DNS查找時間問題，有可能牽出DNS配置不當的問題。

　　2、連接時間：根據瀏覽器和資源的大小不同，瀏覽器可能會在域名上建立一到多個連接，連接時間就是瀏覽器與Web服務器建立TCP/IP連接的時間，連接通常會保持打開狀態，除非Web服務器命令瀏覽器關閉連接。當使用SSL建立安全通信時，連接時間也包括SSL握手的時間，連接時間過長有以下原因：到Web服務器的網絡連接速度較慢，使用了SSL，不允許瀏覽器保持連接打開。

　　3、服務器時間：高服務器時間意味著Web/應用程序服務器需要很長的時間處理請求，監視服務器時間對于找出性能瓶頸和應用程序的擴展問題是至關重要的，通過增加Web服務器實現負載均衡，使靜態內容的擴展是很容易的，當然也可以購買CDN加速服務來達到同樣的目的，但以這種方法實現動態應用程序擴展就行不通了。

　　4、傳輸時間：這個時間與傳輸內容的大小，瀏覽器與服務器之間的連接速度緊密相關，保持低傳輸時間是確保頁面快速載入的關鍵，可以通過減小總的頁面大小，或者通過CDN將內容放在離最終用戶較近的地方改善傳輸時間。

　　5、等待時間：等待時間與相同域名下資源的數量直接相關，受瀏覽器同一域名物理網絡連接數的限制，訪問某個資源時可能必須等待另一個連接的釋放，減少資源的數量，或將資源分布在多個域名上，可以有效減少等待時間。

　　6、域名的數量: 托管網站資源域名的數量也很重要，因為它會影響DNS，連接和等待時間，要下載的資源使用額外的域名將會直接減少等待時間.

　　(全文完)

原文轉自：http://www.wangyuxiong.com/archives/51405