轉自：原文連結

Web 效能優化是一個老生常談的話題，也是前端頁面開發十分重要的部分。當頁面載入速度越慢，使用者流失的概率就越大，效能和互動直接影響使用者體驗。
下面推薦幾款 Web 效能優化輔助工具推薦，希望能對大家有所幫助。

1、Lighthouse

Lighthouse 是 Google 開源的一個自動化工具，用於改進網路應用的質量。你可以將其作為一個 Chrome 擴充套件程式執行，或從命令列執行。
當為 Lighthouse 提供一個要審查的網址，它將針對此頁面執行一連串的測試，然後生成一個有關頁面效能的報告。可以參考失敗的測試，看看可以採取哪些措施來改進應用。
Chrom 擴充套件則會把報告以非常人性化的圖形介面展示給你。

傳送門

2、Speed Racer

SpeedRacer 是一款效能測試工具，它在 Chrome 中執行指令碼，並生成詳細的效能報告。
SpeedRacer 是直接藉助瀏覽器來實際測試效能的工具，在實際工作中，可以與其它模擬使用者訪問流量來評估效能的工具配合使用。

傳送門

3、Yellow Lab Tools

Yellow Lab Tools 是一款 Web 效能及前端質量測試工具。與其他工具不同的是，它有一些在其他工具上無法看到的獨特功能，例如頁面載入時 JavaScript 與 DOM 互動和其他程式程式碼驗證問題。
Yellow Lab Tools 偏向於一個發現不良實踐的工具，會綜合頁面權重、請求數、DOM、錯誤的 Javascript、錯誤的 CSS 等方面取得一個評分。並顯示出在載入頁面的過程中，DOM 是如何相互影響。

傳送門

4、Web Tracing Framework

Web Tracing Framework 也是 Google 推出的一組用於跟蹤和調查複雜 Web 應用的庫、工具和視覺化工具合集。它可以幫助發現效能問題，跟蹤迴歸，並構建流暢的 60fps Web 應用。能讓你花更少時間來測試程式碼即可。

傳送門

5、grunt-perfbudget

grunt-perfbudget 是一款用於評估效能的 Grunt task，它使用 WebPagetest 的公有或私有例項在特定的 URL 進行測試，並將測試結果和你預期的效能期望做比較。
如果小於預期，那麼這個 task 就順利完成了，如果超過了預期的效能期望，那麼就會報告失敗，並幫助你分析超出預期的原因。

傳送門

6、Sitespeed.io

Sitespeed.io 是一組基於最佳實踐以及一些載入時序等量化標準的開源工具，用以幫助開發者分析網頁的載入速度和渲染效能。
Sitespeed.io 從開發者的站點收集多個頁面的資料，並根據最佳實踐等規則來分析這些網頁，然後將結果以 HTML 的形式輸出，或者以數值的形式傳送到 Graphite 。

傳送門