使用 Lighthouse 创建你的第一个性能预算

Avatar of Robin Rendle
Robin Rendle

DigitalOcean 为您旅程的每个阶段提供云产品。立即开始使用 200 美元的免费额度!

Ire Aderinokun 撰写了一篇关于使用 Google 的工具套件 Lighthouse 设置性能预算(并坚持执行)的新方法,该工具套件可帮助开发人员了解其网站的性能和可访问性。

直到最近,我也没有设置正式的性能预算并执行它。这并不是说我从未进行过性能审计。我经常使用 PageSpeed Insights 等工具并根据反馈进行改进。但我从未做过的是设置网站需要满足的一系列指标,并使用一些自动化工具执行它们。

造成这种情况的原因是,我不知道应该为预算使用哪些确切的数字,以及在设置预算和测试/执行预算之间存在脱节。这就是为什么当 Google I/O 今年宣布 Lighthouse 团队支持可以与 Lighthouse 集成的性能预算时,我感到非常兴奋。我们现在可以在 JSON 文件中定义一个简单的性能预算,该预算将在 Lighthouse 审计中进行测试!

我完全同意 Ire 的观点,而且与他一样,我也倾向于忽视坚持性能预算,仅仅是因为测试过程非常手动且乏味。但现在结束了!正如 Ire 在这篇文章中展示的那样,你甚至可以设置 Lighthouse,使其在 GitHub 中的每个 PR 中测试你的预算。该工具称为 lighthousebot,它正是我一直在寻找的东西——一种自动化且可预测的方式,将性能预算集成到我对代码库所做的每一项更改中。

现在,lighthousebot 将在测试完成后对你的 PR 进行评论,并显示你的前后得分。

这有多棒?这让我想起了 Gareth Clubb 最近关于 改进网络性能 并在组织中围绕预算构建文化的文章。还有什么比在他们每次进行更改后,就在 GitHub 中提醒每个人注意性能更好的方法呢?

直接链接 →