Google Lighthouse 成功案例:通過技術優化提高性能
已發表: 2019-05-23借助 Google Lighthouse,您可以快速輕鬆地評估任何 URL 的技術性能。 詳細的測試測量加載時間、可訪問性和網絡安全,同時揭示改進網站技術基礎設施的潛力。 在這篇博文中,我想分享一些成功使用 Google Lighthouse 幫助提昇在線績效的公司的例子。 了解亞洲市場 Carousell 如何使用 Lighthouse 將自然流量提高 63%,TripAdvisor 和 Expedia 的 Lighthouse 性能得分如何與 Google 排名相關,等等。
如果您正在尋找 Google Lighthouse 是什麼以及它與搜索引擎排名的相關性的概述,那麼您可以從閱讀我們的 Searchmetrics 白皮書“2019 年 Google Lighthouse 排名因素”開始。 本文基於超過 1500 萬次 Google Lighthouse 審計的數據分析了 Google.com 上排名靠前的網站的當前優化狀態。 在此處下載白皮書:
谷歌燈塔排名因素 2019
成功案例 1:亞洲的 eBay 如何將其燈塔表現從 17 分提高到 84 分
我們的第一個 Lighthouse 案例研究來自亞洲對 eBay 的回答,即市場 carousell.com。 新加坡平台主要依賴移動流量,為了擴展到印度尼西亞和菲律賓等其他亞洲國家,他們正在尋找一種方法來增加其 Progressive Web App 的移動加載時間:“擁有一個網頁需要更多時間Carousell 的網絡技術主管 Stacey Tay 在 Medium 上的一篇博文中解釋說,如果我們想獲得和留住新用戶,超過 3G 的加載時間(就像我們所做的那樣)超過 15 秒是不可接受的,他描述了 Carousell 如何實現技術性能優化他們的網站。
首先,Stacey 解釋說,他們最初的 Lighthouse 審核結果敲響了警鐘——性能得分僅為 17 分,而 Progressive Web App 和可訪問性類別的結果非常平庸。 只有 SEO 和最佳實踐這兩個類別的得分(側重於 HTTPS 或安全 JavaScript 庫等網站的安全方面)令人滿意。
基於這些結果,優化主要針對改進 Lighthouse 類別的性能和漸進式 Web 應用程序的結果。 carousell.com 的 Lighthouse 分數的前後對比顯示了在這些領域取得了多大的進步:

技術優化措施於 2018 年進行——10 月底,Stacey Tay 在 Medium 上記錄了成功。 如果我們查看 carousell.com 在其母國新加坡的 SEO Visibility,那麼我們可以看到性能有明顯的提升:
在執行優化所需的任務之前,明確了任務目標:
“我們希望從一開始就為新用戶提供令人愉悅的體驗,因為性能就是用戶體驗。 為此,我們設計了一種新的、性能優先的網絡體驗。” Carousell 的網絡技術主管 Stacey Tay
這一使命為網站的技術優化奠定了基礎。 重要的是,這並沒有被視為一個副項目,它被高度優先考慮並給出了專門的性能預算。 有了這個使命,Stacey 寫道,更容易激勵團隊,讓管理層相信項目的重要性,並通過展示項目的成功來證明投資的合理性。
在同意預算後,根據 Google Lighthouse 審計的分數確定了目標:
| 燈塔排名因素 | 目標值/分數 |
| 關鍵路徑資源 | 120 KB |
| 第一次內容豐富的油漆 | 2s |
| 互動時間 | 5s |
| 燈塔性能得分 | > 85 |
如前所述,優化前的性能得分僅為 17 分。 在優化了carousell.com的首頁後,他們得到了84分。 解決的站點基礎架構方麵包括使用工作箱預緩存和服務工作者設置更有效的緩存系統、壓縮圖像和應用 CSS 內聯。 這些措施共同促成了一個快速、用戶友好的漸進式 Web 應用程序的創建——這就是現在頁面加載的方式:

Carousell 的性能優化成功的有力證據可以在數字中找到。 除了將加載時間減少 65% 外,最值得注意的改進是流量的增加。 自優化以來,Carousell 的自然流量增長了 63%:

閱讀 2019 年谷歌燈塔排名因素
成功案例 2:史泰博和沃爾瑪如何利用更快的加載時間來提高轉化率
在談論加載時間的優化時,有一些谷歌統計數據經常被用作參考點。 例如,隨著加載時間的增加,移動用戶返回搜索結果的可能性也會增加。 如果加載時間從 1 秒上升到 3 秒,則跳出率概率增加 32%; 如果加載時間從 1 秒變為 5 秒,則跳出概率會上升 90%。

頁面速度分析工具 GTmetrix 研究了減少加載時間的具體好處,查看了廣泛的零售網站。 這些例子包括像 Staples 和沃爾瑪這樣的重量級零售商,並展示了更快的加載時間和更高的轉化率之間的明顯相關性。

閱讀 2019 年谷歌燈塔排名因素
成功案例 3:Douglas 如何將加載時間減半
現在我們求助於德國香水巨頭 Douglas,他使用 Google Lighthouse 極大地改善了他們的網站性能。 他們的成功故事可以追溯到 2017 年黑色星期五,當時流量激增意味著某些用戶無法訪問該頁面。 當時的 Google Lighthouse 性能分數也顯示出明顯的改進空間。 Michael Singer 是慕尼黑的一名自由職業技術 SEO 顧問,他為 douglas.de 從事該項目,並從 2018 年 5 月開始協調 IT 和 SEO 之間的操作,他解釋說:“在優化之前,3G 上的交互時間超過 20 秒——現在我們已經把它縮短到 8 秒左右。”
為了在 Google Lighthouse 審計中取得如此令人印象深刻的結果,對香水零售商網站的後台進行了重大更改。 “我們檢查了 200 多張技術票,”Michael 解釋說,並回憶起所做的許多更改: 移動子域已停用; 移動用戶現在登陸 Douglas 的響應式主 www 域。 此外,douglas.de 被轉換為使用 JS React,它減少了節點和請求的數量,壓縮了 HTML 並減小了圖像大小。 數據庫延遲也減少了,並且實施了一些緩存優化。
“我們工作的重點是用戶,他們應該能夠盡快使用網站。 我們的頁面速度優化的目標是減少 4 秒的第一次交互時間。 這與切換到 JS React 和轉向單一響應式網站版本一起,導致我們的 SEO 可見性顯著增長、流量增加和營業額增加。” Michael Singer,自由技術 SEO 顧問
這些優化使用 Google Lighthouse 性能得分,顯著縮短了頁面加載時間。 “為了驗證這些指標,我們使用 Instana 進行了實時速度測試,向我們展示了長期影響。 2018 年 4 月,桌面值仍然超過 8 秒。 2018 年 10 月,我們經常達到 4 秒的成績。” 最後但同樣重要的是,網站的技術可用性也得到了改進,因此現在可以更好地處理像黑色星期五那樣的流量高峰。
這種性能優化為 douglas.de 的 SEO 可見性帶來了立竿見影的好轉。 在 2018 年 5 月至 2019 年 5 月期間,該域的有機可見度增加了 25%。
當然,Searchmetrics SEO Visibility 只是網站在 Google 上的表現的一個初始指標。 Michael Singer 進一步深入了解了受 douglas.de 優化影響的其他 KPI。 “訪問量大幅增加,營業額也出現強勁增長,”邁克爾說。 轉化率也增加了類似的比例,尤其是因為 SEO 是為 douglas.de 帶來最多營業額的渠道。
道格拉斯優化結果一目了然:
- 頁面加載時間 -50%
- 搜索引擎優化可見度 +25%
- 訪問量、轉化率和營業額大幅增加。
閱讀 2019 年谷歌燈塔排名因素
成功案例 4:URL 性能如何影響 TripAdvisor 和 Expedia 的 Google 排名
為了調查 Lighthouse Performance 分數與真實 Google 排名之間的關係,我決定在旅遊業內進行分析。 我圍繞酒店、航班和大篷車等主題整理了 3500 個與旅行相關的關鍵詞,並分析了 Google.com 上的排名頁面,並查看了 TripAdvisor 和 Expedia 對這些關鍵詞的排名位置。 結果:TripAdvisor 和 Expedia 在 Google Lighthouse 性能也很高時排名很高:
為什麼這裡有如此清晰的聯繫? 在線旅遊行業競爭激烈,眾多大公司在競爭。 除了 TripAdvisor 和 Expedia,您還有 Booking.com、Hotels.com、FlightRadar 等,它們都具有很高的信任度,並且都是知名的流行品牌。 同時,很難區分不同的品牌。 在許多情況下,內容(例如酒店描述)會非常相似——這使得網站很難在主要的 USP 中脫穎而出。 如果幾個排名信號基本相同——相似大小的品牌、相似的界面、相似的功能、相似的內容——那麼網站性能很可能是確定排名的決定性因素。
“快速加載時間對於良好的用戶體驗非常重要。 與網站交互時的每一次中斷都會產生一點挫敗感,並且用戶的挫敗感會隨著中斷的發生而增加。 如果加載時間僅增加幾秒鐘,那麼許多網站的跳出率都會增加——這最終會導致轉化率下降。” Nils Kattau,轉換專家
要了解 Google Lighthouse 結果與您的市場的相關性如何,您可以使用自定義的 Searchmetrics Ranking Factors。 我們針對您的相關市場分析 Google Lighthouse 數據,將其與我們自己的 Searchmetrics 排名數據相結合,並為您的網站技術優化提供具體、可行的建議。 立即索取您的個人報告:
請求定制的 Searchmetrics Lighthouse 審計

“我們希望從一開始就為新用戶提供令人愉悅的體驗,因為性能就是用戶體驗。 為此,我們設計了一種新的、性能優先的網絡體驗。” Carousell 的網絡技術主管 Stacey Tay
“我們工作的重點是用戶,他們應該能夠盡快使用網站。 我們的頁面速度優化的目標是減少 4 秒的第一次交互時間。 這與切換到 JS React 和轉向單一響應式網站版本一起,導致我們的 SEO 可見性顯著增長、流量增加和營業額增加。” Michael Singer,自由技術 SEO 顧問
“快速加載時間對於良好的用戶體驗非常重要。 與網站交互時的每一次中斷都會產生一點挫敗感,並且用戶的挫敗感會隨著中斷的發生而增加。 如果加載時間僅增加幾秒鐘,那麼許多網站的跳出率都會增加——這最終會導致轉化率下降。” Nils Kattau,轉換專家