Pagespeed見解報告分析

Question

我正在使用頁面速度方面的見解，需要一些幫助以正確理解此工具的報告。

我想清楚地知道這份報告告訴我有關績效方面的這項工作的內容 。

這是該報告顯示的性能得分較低的報告。

這是表現出更好性能得分的報告。

這是根據grunt-pagespeed報告的樣子：

對於這些情況，我看不到相同的報告結果。 您可以從上面的示例中看到，它以文件的優化/縮小百分比顯示值，但是在我的情況下，我看到諸如236,7表示優化圖像或0.65表示css縮小。

雖然我只是通過查看css / html / javascript / css以及調用服務器，gzip，圖像等資源的數量來改善我的頁面，但我仍然不清楚如何理解該報告的價值。

Answer 1

我建議您使用Google Pagespeed Insights和webpagetest.org ，以便輕松查看最值得關注的內容。 首先，這些實用程序將非常輕松地確定您的網站正在發生什么。

這是瀑布圖。 這樣可以使您更好地了解如何在頁面上處理和加載資源，以及哪些資源占用的時間最長。

Answer 2

在進行了一些研究之后，我看到了這個鏈接，實際上可以幫助我了解報告值的工作方式。

https://developers.google.com/speed/docs/insights/v1/getting_started

它實際上解釋說，此報告的結果可能以與該工具一起使用的每條規則的影響百分比或價值來表示：

https://developers.google.com/speed/docs/insights/rules

http://addyosmani.com/blog/automating-web-performance-measurement-with-psi-for-node/

所以實際上在第一個報告中我們可以看到：

例如，“優化圖像”的影響要比檢查任何其他規則高。

我們可以看到的第二個報告：

嘗試最小化圖像大小或修復渲染塊以具有更好的性能幾乎都是相同的，兩者的值都接近2.0倍

我為此寫了一篇文章： http : //jotaoncode.com/blog/news/2015/11/09/page-speed-insights/

其他性能檢查資源包括：

http://tools.pingdom.com/fpt/#!/cDKSlP/jotaoncode.com

http://www.webpagetest.org/

而且，如果您想查看您的網站費用是多少：)

https://whatdoesmysitecost.com/