Lowe's 網站是成效最好的電子商務網站之一

透過打造自動化效能測試和監控系統, Lowe's 的網站速度團隊測試能依據效能預算提取要求,並防止效能降低。

Abhimanyu Raibahadur
Abhimanyu Raibahadur
Ashish Choudhury
Ashish Choudhury
Dhilip venkatesh Uvarajan
Dhilip venkatesh Uvarajan
Dinakar Chandolu
Dinakar Chandolu
Garima Mimani
Garima Mimani
Safwan Samla
Safwan Samla

Lowe's 是將近 $900 億美元的居家修繕零售商,經營約 2,200 間門市,並僱用 30 萬家以上的員工。藉由建構自動化測試和監控系統,避免效能迴歸部署到實際工作環境後,Lowe's 的網站速度團隊成功改善了網站效能,排名在頂尖零售網站上排名第一。

問題

Site Speed Team 的目標是讓 Lowe's 網站成為載入速度最快的電子商務網站之一,以提升網頁載入效能。 在建構自動化測試和監控系統之前,Lowe 的網站開發人員無法在正式生產前的環境中自動評估效能。現有工具只會在正式環境中進行測試。因此,在實際工作環境中融入實際工作環境,導致使用者體驗不佳。這些較不理想的建物會持續在實際工作環境中,直到網站速度團隊偵測到並由作者還原為止。

解決方法

Site Speed 團隊使用開放原始碼工具,為試產環境建立了自動化效能測試和監控系統。 系統會評估每個提取要求 (PR) 的成效,如果不符合網站速度團隊的效能預算指標條件,則 PR 會從運送到實際工作環境。同時衡量 SEO 與 ADA 法規遵循。

影響

針對超過 16 週部署 102 個版本的 1 個團隊樣本,自動化效能測試和監控系統總共阻止了 32 個版本的效能差強的建構作業。

過去,現在需要利用 3 至 5 天,通知開發人員已將效能迴歸於實際工作環境中,然後自動在正式生產環境中提交提取要求五分鐘後,自動通知開發人員發生效能問題。

隨著效能迴歸標記的提取要求變少了,這項數據會隨著時間逐漸改善程式碼品質。此外,為了持續改善網站品質,網站速度團隊也會逐漸調適管理預算。

一般來說,擁有問題程式碼的明確擁有權,就能改變工程文化。該團隊不必承認被動更正,因為不清楚問題發生者是誰,而是可以客觀地將有問題的程式碼擁有權主動進行最佳化。

導入作業

網站速度管理 (SSG) 應用程式的核心是 Lighthouse CI。 SSG 應用程式使用 Lighthouse 驗證及稽核每個提取要求的網頁效能。

SSG 應用程式的流程圖,本文稍後將說明圖中所示的步驟。

如未達到網站速度團隊所定義的效能預算和指標目標,SSG 應用程式會導致建構失敗。不僅能強制執行載入效能,還會強制執行 SEO、PWA 和無障礙功能。 這類解決方案會立即向作者、審查人員和 SRE 團隊回報狀態。 服務也可設定在需要例外狀況時略過檢查。

自動化速度管理 (ASG) 流程

Spinnaker

起點。開發人員將程式碼合併到試產環境中。

  1. 利用 CDN 資產部署試產環境。
  2. 檢查部署是否成功。
  3. 執行 Docker 容器,開始建構 ASG 應用程式或傳送通知 (在部署失敗時)。

Jenkins 和 Lighthouse

  1. 使用 Jenkins 建構 ASG 應用程式。
  2. 執行已安裝 Chrome 和 Lighthouse 的自訂 Docker 容器。 從 SSG 應用程式提取 lighthouserc.json 並執行 lhci autorun --collect-url=https://example.com

Jenkins 和 SSG 應用程式

  1. 從 lhci 擷取 assertion-results.json,並與 budgets.json 中的預先定義預算進行比較。 將輸出內容儲存為文字檔,並上傳至 Nexus,方便日後比較。
  2. 比較目前的 assertion-results.json 與上次成功的版本 (從 Nexus 下載),並儲存為文字檔。
  3. 建立 HTML 電子郵件,並在當中提供成功或失敗資訊。
  4. 使用 Jenkins 將電子郵件傳送至相關的通訊群組清單。