测试篇：性能监测之Performance、LightHouse 与性能 API

向下拉动 Report 页，我们还可以看到每一个指标的细化评估：

在“Opportunities”中，LightHouse 甚至针对我们的性能问题给出了可行的建议、以及每一项优化操作预期会帮我们节省的时间。这份报告的可操作性是很强的——我们只需要对着 LightHouse 给出的建议，一条一条地去尝试，就可以看到自己的页面，在一秒一秒地变快。

除了直接下载，我们还可以通过命令行使用 LightHouse：

npm install -g lighthouse

lighthouse https://juejin.im/books

• 1

• 2

• 3

同样可以得到掘金小册的性能报告。

此外，从 Chrome 60 开始，DevTools 中直接加入了基于 LightHouse 的 Audits 面板：

LightHouse 因此变得更加触手可及了，这一操作也足以证明 Chrome 团队对 LightHouse 的推崇。

可编程的性能上报方案： W3C 性能 API

---

W3C 规范为我们提供了 Performance 相关的接口。它允许我们获取到用户访问一个页面的每个阶段的精确时间，从而对性能进行分析。我们可以将其理解为 Perform