Web應用性能分析工具—HAR文件

來源 https://raynorli.com/2018/06/11/web-performance-analysis-har-file/

 

客戶經常有的一個問題就是，我的網頁服務通過你的設備之后，訪問變慢了，這類直觀感受的故障很不好量化，而且基於Web應用的架構，其實可能牽扯到很多問題，對於定位問題以及精確收集數據都會有不小的挑戰。

現代Web網頁都不是一個HTTP請求（request）就能搞定的，打開一個網頁需要許多HTTP交互（transaction）才可以完整顯示一個網頁，有時候就是一個HTTP請求沒有得到及時響應，造成了整體網頁加載速度變慢，但是怎么找出這一個有問題的HTTP請求呢？

如果是做過Web前端開發的同學會說，我們可以按F12，進入瀏覽器的開發者模式來查看各個請求所消耗的時間，這是個可行的方法，但是作為技術支持，沒有辦法長時間占用客戶電腦來進行排查，那么有沒有工具可以幫我們收集這部分信息呢？答案當然是肯定的。

通過開發者模式查看我們訪問百度時實際瀏覽器所發出的所有HTTP交互

HTTP Archive format

又稱HAR文件，是用來記錄瀏覽器加載網頁時所消耗的時間的工具。它可以記錄每一個HTTP請求發出直到收到完整的HTTP響應中間所耗費的時間，可以迅速幫助我們知道是哪些HTTP請求沒有得到及時的回復，從而進行更一步的排查。

加載百度時的HAR文件展開時

 

• 谷歌（Chrome）瀏覽器收集HAR文件

 

• 火狐（FireFox）瀏覽器收集HAR文件

 

• IE瀏覽器收集HAR文件

• Tips：一定要記得打開第2步中左邊的開始抓包鍵

 

如何查看HAR文件

維基中列出的支持軟件有以下

• Firebug
• Fiddler
• HttpWatch
• Charles Web Proxy (software)
• Firefox
• Google Chrome
• Internet Explorer 9
• Microsoft Edge[4]
• Paw (software)[5]
• Restlet Client (software)[6]

不過我一般是去這個網站來查看

http://www.softwareishard.com/har/viewer/

 

============= End