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 的网站速度团队得以提升网站性能,使其跻身零售网站前列。

问题

网站速度团队的目标是让 Lowe's 网站成为页面加载速度最快的电商网站之一。 在构建自动化测试和监控系统之前,Lowe 的网站开发者无法在预生产环境中自动衡量性能。现有工具仅在生产环境中执行测试。因此,低质量的 build 会进入生产环境,导致用户体验不佳。 在网站速度团队检测到这些低劣 build 并由作者还原之前,这些 build 会保留在生产环境中。

解决方案

网站速度团队使用开源工具为预生产环境构建了自动化性能测试和监控系统。系统会衡量每个拉取请求 (PR) 的性能,如果 PR 不符合网站速度团队的性能预算指标标准,则会阻止其发布到生产环境。该系统还会衡量 SEO 和 ADA 合规性。

影响

在 16 周内部署 102 个 build 的 1 个团队样本中,自动化性能测试和监控系统阻止了 32 个性能欠佳的 build 进入生产环境。

以前,网站速度团队需要 3 到 5 天的时间才能通知开发者他们已将性能回归问题发布到正式版环境中,而现在,系统会在预生产环境中提交拉取请求后的 5 分钟内自动通知开发者存在性能问题。

代码质量会随着时间的推移而不断提高,这从被标记为存在性能回归问题的拉取请求数量减少这一事实可见一斑。网站速度团队也正在逐步缩减治理预算,以不断提升网站质量。

总的来说,明确界定有问题代码的所有权改变了工程文化。团队可以通过客观归因有问题代码的所有权,主动进行优化,而不是因为始终不清楚是谁引入了问题而勉强进行被动修正。

实现

网站速度治理 (SSG) 应用的核心是 Lighthouse CI。SSG 应用使用 Lighthouse 验证和审核每个拉取请求的网页性能。

SSG 应用的流程图,本文后面部分介绍了图中显示的步骤。

如果未达到网站速度团队定义的性能预算和指标目标,SSG 应用会导致 build 失败。它不仅强制执行加载性能,还强制执行 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 与上次成功的 build(从 Nexus 下载)进行比较,并将其保存为文本文件。
  3. 构建包含成功或失败信息的 HTML 电子邮件。
  4. 使用 Jenkins 将电子邮件发送到相关分发列表。