不度量性能，就无法优化性能

一件事情如果无法衡量，就无法管理。

——管理大师彼得·德鲁克

如果要对一个页面的性能进行真正有效的优化，而不是只让自己感觉它似乎快了一些，就需要先找到一个合理的方式度量页面的性能。

度量的方式有很多种。例如，当刷新一个页面时，在DevTools的Network面板中可以看到Load、DOMContentLoaded的时间等（见图2-1），这是一种度量方式。

图2-1　Load、DOMContentLoaded的时间

也可以通过录屏的方式对一个网页的打开过程进行计时（见图2-2），计算从页面打开到用户看到主要内容的时间间隔。

图2-2　WebPageTest的加载屏幕录制

度量的方式有很多种，但不同的度量方式关注的点并不同，这是因为性能本身就不仅仅是指某个指标的状况，上面这两种方式关注的并不是同一类性能。前者关注资源在什么时间点加载完毕，后者关注的则是用户在什么时间点可以看到主要内容。

在进行性能优化之前，需要先确定要优化的目标，并为这个目标定义指标。例如，可以优化加载页面的时间，让用户更早地看到页面渲染的内容；也可以优化页面的滚动性能，让用户在滚动时不会频繁地感到卡顿。这两种优化的目标需要衡量的指标是完全不同的，前者的是关键元素的渲染时间，后者的是滚动时的帧率等。