Google PageSpeed Insights 與 Lighthouse:哪個衡量網站性能最好?

已發表: 2022-09-16

頁面速度是一個重要的谷歌排名因素——但它也是數字營銷人員最不了解的因素之一。 在本文中,我將幫助您更好地了解頁面速度並比較 Google 的官方跟踪工具:PageSpeed Insights 和 Lighthouse。

什麼是頁面速度?

頁面速度是瀏覽器發送訪問頁面的請求和頁面呈現內容之間的時間量。 頁面由許多可見和不可見的組件(圖像、文本、跟踪器、插件等)組成,具有不同的加載時間和用戶目的。 谷歌將頁面速度分解為衡量加載里程碑的特定指標,例如第一次內容繪製和交互時間。

頁面速度會隨著站點的增長、技術的變化和 Web 標準的發展而波動。 它會影響訪問者如何使用您的網站,甚至影響他們是否轉化。 因此,跟踪頁面速度應該是您常規站點健康監控過程的基本部分。

但是最好的頁面速度跟踪工具是什麼?

Google 提供了兩個官方選項:Google PageSpeed Insights 和 Lighthouse。 兩者都是免費的、強大的工具,旨在幫助數字營銷人員和開發人員優化他們的網站頁面速度——它們之間有一些關鍵區別。 讓我們比較 PageSpeed Insights 與 Lighthouse,並討論您需要了解的有關跟踪和提高頁面速度的知識。

什麼是 Google PageSpeed Insights?

Google PageSpeed Insights (PSI) 是一款免費工具,可使用真實世界和實驗室數據測量桌面和移動設備上的頁面速度指標。 實際數據(也稱為“現場數據”)是從 Chrome 用戶體驗報告中提取的 28 天匯總數據,而實驗室數據是使用 Lighthouse API 計算的。

PSI 對任何人來說都很簡單:只需前往 https://pagespeed.web.dev/,插入一個 URL,然後等待 API 生成報告。 您將能夠看到該 URL 如何與 Google 的核心 Web Vitals 相匹配,評估詳細的速度指標,並獲得整體網站性能評級。

績效評級是一個 每個速度指標得分的加權平均值。 這就像一個整體成績,但不是一個萬能的衡量標準。 下面括號中的百分比表示計算績效評級時每個指標的權重。

  • First Contentful Paint: (10%)第一個圖像或文本塊完全加載需要多長時間。
  • 速度指數: (10%) 可見內容加載到屏幕完成所需的平均時間。
  • Largest Contentful Paint: (25%) 最大的圖像或文本塊完全加載需要多長時間。
  • 交互時間: (10%) 頁面完全交互需要多長時間。
  • 總阻塞時間: (30%) 首次內容繪製和交互時間之間的時間差,在此期間頁面被阻止用戶輸入。 (換句話說,某事物首次出現在屏幕上與用戶實際可以點擊它之間的時間差。)
  • 累積佈局偏移: (15%) 對意外佈局偏移的度量,即內容加載無序會重新組織頁面或將其他內容向上或向下移動。

如果您的網站的性能評級不完美,或者您的某些指標看起來很低,請不要太擔心。 速度指標可能會根據您無法控制的一些因素而波動。 請記住,這些指標是數據的匯總,實際體驗會因用戶而異。

也就是說,您可以通過關注報告底部附近的“機會和診斷”部分來最大化您的績效評級並提高頁面速度。 這些部分包含可以提高速度指標的特定操作的建議,儘管它們可能需要 SEO Web 開發人員的幫助才能實施。

什麼是谷歌燈塔?

Google Lighthouse 是一個免費的開源工具,可以執行站點審核以衡量許多不同的指標。 除了評估頁面速度之外,Lighthouse 還可以評估網站符合現代 Web 開發標準的程度、網站的可訪問性級別、可抓取性等。

Lighthouse 專門使用實驗室數據,這意味著審核在受控的預定義環境中運行,而不是從實際用戶數據中收集。

有幾種不同的方法可以訪問 Google Lighthouse 速度測試。 非開發人員使用 Lighthouse 的最簡單方法是通過 Chrome 瀏覽器擴展程序,儘管該擴展程序無法自行審核帶有 cookie 身份驗證的頁面。 開發者可以使用 Chrome DevTools 進行完全訪問。

您的燈塔報告將包括以下信息:

  • 性能:性能審計測量所有與 PSI 相同的速度指標,並提供更詳細的開發數據。
  • 最佳實踐:最佳實踐審核著眼於與現代開發標準(包括安全標準)相比的站點整體“代碼健康狀況”。
  • 可訪問性:將 Web 可訪問性提煉成一個分數是不可能的,因此可訪問性審核會尋找各種改進設計、用戶界面、語言、開發和其他領域的機會。
  • SEO:搜索引擎優化 (SEO) 審計提供了一個基本測試,用於檢查搜索引擎是否可以輕鬆抓取您的頁面。
  • Progressive Web App:如果您的網站是 Progressive Web App,則此審核會衡量其總體速度、可靠性和可安裝性。

什麼是燈塔堆棧包?

Stack Packs 是 Lighthouse 的最新功能之一。 使用 Stack Packs,開發人員可以根據頁面使用的堆棧查看基於堆棧的建議。 這些建議比 Lighthouse 提供的標準一般建議更相關,後者並不兼容所有工具和平台。 新的 Stack Pack 經常發布,因此請訪問官方 Github 存儲庫以了解更多信息。

Google PageSpeed Insights 與 Lighthouse

Google PageSpeed Insights結合了真實世界的用戶和實驗室數據,以提供全面、易於理解的頁面速度概覽。 Lighthouse以開發人員為中心,從審核中收集實驗室數據,涵蓋從頁面加載速度到 Web 安全的方方面面。 兩者都提供改進建議。

Google PageSpeed Insights 與 Lighthouse:概述

特徵谷歌 PageSpeed 見解谷歌燈塔
如何訪問https://pagespeed.web.dev/(瀏覽器訪問;無需登錄) Google Chrome 瀏覽器擴展(推薦給非開發者)
Chrome 開發者工具
節點 CLI 工具
燈塔 CI(Github 鏈接)
數據源Chrome 用戶體驗報告(真實數據)
Lighthouse API(模擬實驗室數據)
燈塔 API
評估一次一頁一次一頁或一次多頁
指標核心 Web Vitals、頁面速度性能指標(首次內容繪製、速度索引、最大內容繪製、交互時間、總阻塞時間、累積佈局偏移) 性能(包括頁面速度指標)、可訪問性、最佳實踐、SEO、漸進式 Web 應用程序(如果適用)
建議標有“機會和診斷”的部分提供了提高頁面速度的具體建議。 標有“機會和診斷”的部分提供了提高頁面速度的具體建議。 堆棧包可用於定制改進建議。
最適合每個人開發者

何時使用 Google PageSpeed Insights

如果您想清楚地了解 URL 的速度和具體的改進建議以自行實施或轉發給開發人員,請使用 PSI。

何時使用 Google Lighthouse

如果您是開發人員(或具有一定開發知識的非開發人員)並希望深入了解除頁面速度之外的許多不同站點指標,請使用 Lighthouse。 Stack Packs 可以幫助提供比 Lighthouse 提供的標準建議更多的定制建議。

想要最好的數據? 同時使用 PageSpeed Insights 和 Lighthouse

PSI 和 Lighthouse 各有長處和局限性——但當它們一起用於構建您的站點的完整圖片時,它們是最有效的。

Lighthouse 提供了更廣泛的數據視圖,而 PageSpeed Insights 讓您更真實地了解網頁對實際用戶的表現。 使用兩者來獲得改進您網站的前端和後端的建議。 您擁有的數據越多,您的網站調整就越有效。

通過我們的免費電子書充分利用 Google 工具

如果你從這篇文章中學到一件事,那就是頁面速度很重要——而且比表面上看起來要復雜得多。 就像提高網站速度的方法不止一種一樣,提高網站搜索引擎性能的方法也不止一種——甚至是跟踪數據的最佳 Google 工具。

優化您的網站涉及處理大量數據和導航複雜的工具。 為了讓事情變得不那麼複雜,請下載我們的免費電子書, Google Tools for SEO

下載用於 SEO 的谷歌工具指南

用於 SEO 的 Google 工具指南

下載本指南,了解如何充分利用 Google 提供的免費、強大的工具來改進您的 SEO 流程和性能。