燈塔效能評分

Lighthouse 如何計算整體效能分數

一般來說,只有指標會影響 Lighthouse 效能分數,而非機會或診斷結果。不過,改善商機和診斷資料可能會提升指標值,因此兩者之間存在間接關係。

以下說明分數可能波動的理由、分數組成方式,以及 Lighthouse 如何為各項指標評分。

分數波動的原因

整體成效分數和指標值的變化幅度很大,這並非 Lighthouse 造成的。如果成效分數產生波動,通常是因為基本條件變化。常見問題包括:

  • 放送廣告的 A/B 版本測試或變更內容
  • 網路流量路由異動
  • 在不同裝置上進行測試,例如高效能桌上型電腦和低效能筆記型電腦
  • 插入 JavaScript 及新增/修改網路要求的瀏覽器擴充功能
  • 防毒軟體

Lighthouse 的變異性說明文件有更深入的探討。

此外,雖然 Lighthouse 可提供單一整體效能分數,但將網站成效視為分數分布,而非單一數字,可能會更有幫助。請參閱以使用者為中心的效能指標的介紹,瞭解原因。

成效分數的加權方式

效能分數是指標分數加權平均值。自然地,權重較高的指標對整體成效分數的影響就越大。 報表中不會顯示指標分數,但系統會在幕後計算這項指標。

Lighthouse 評分計算機網頁應用程式
使用 Lighthouse 評分計算工具探索分數

燈塔 10

燈塔 8

指標分數的判定方式

Lighthouse 收集到成效指標 (通常以毫秒為單位) 後,就會查看指標值在 Lighthouse 評分分佈中的哪個位置,將每個原始指標值轉換為 0 到 100 的指標分數。 評分分佈是對數常態分佈,源自 HTTP 封存中實際網站效能資料的效能指標。

舉例來說,最大內容繪製 (LCP) 是指使用者感知網頁最大內容可見的時間。LCP 的指標值代表從使用者啟動網頁載入到顯示主要內容之間的時間長度。根據實際網站資料,成效最佳的網站在 1,220 毫秒內完成 LCP 算繪,因此指標值會對應至 99 分。

深入一點來說,Lighthouse 評分曲線模型會使用 HTTPArchive 資料來判斷兩個控制點,接著設定 對數正態曲線的形狀。HTTP 檔案庫資料的 25 百分位數會變成 50 分 (中位控制點),而 8 百分位數會變成 90 分 (良好/綠色控制點)。探索評分曲線圖時,請留意 0.50 和 0.92 之間,指標值和分數之間具有近乎線性關係。分數約為 0.96 時,就是「邊際效益遞減點」,分數越高,曲線就會越往右上方移動,需要越多指標改善才能提高分數。

TTI 評分曲線的圖片
探索 TTI 的評分曲線

電腦版和行動版的處理方式

如先前所述,分數曲線是由實際成效資料所決定。在 Lighthouse 第 6 版之前,所有分數曲線都是以行動裝置效能資料為基礎,但電腦版 Lighthouse 會使用該資料。實際上,這導致電腦分數遭人為增加。Lighthouse 6 版已修正這個錯誤,並使用特定的電腦版評分機制。雖然整體效能分數確實會從 5 變成 6,但電腦版的分數會出現明顯差異。

分數的顏色標示方式

指標分數和效能分數會根據下列範圍標上顏色:

  • 0 到 49 (紅色):不佳
  • 50 到 89 (橘色):需要改善
  • 90 到 100 (綠色):良好

為了提供良好的使用者體驗,網站必須達到良好的分數 (90-100)。100 分的「完美」分數極具挑戰性,因此無法達成。 舉例來說,以 99 分至 100 分來說,需要的改善量就等同為 90 至 94。

開發人員可以採取哪些行動來提高成效分數?

首先,請使用Lighthouse 評分計算工具,瞭解要達到特定 Lighthouse 效能分數時,應設定哪些門檻。

在 Lighthouse 報表中,「商機」部分會提供詳細建議,並說明如何實作。此外,「診斷」專區列有其他指南,可協助開發人員進一步改善成效。