介绍
我们已经知道性能的重要性,但当我们讨论性能的时候,让一个网页变得跟快,具体是指哪些? 事实上性能是相对的:
- 对于一个用户而言,一个站点可能速度很快(在具有功能强大的设备的快速网络上),而对于另一用户而言,一个站点可能会较慢(在具有低端设备的慢速网络上)。
- 两个站点可能会在完全相同的时间内完成加载,但一个站点似乎加载速度会更快(如果它逐步加载内容,而不是等到最后显示任何内容)。
- 一个网站可能会出现快速加载但后来(在全部或没有)慢慢地响应用户的交互。
所以在讨论性能的时候,精确的、可量化的指标很重要。
但是,仅仅因为一个度量标准是基于客观标准并且可以定量地度量的,并不一定意味着这些度量是有用的。
对于 Web 开发人员来说,如何衡量一个 Web 页面的性能一直是一个难题。
最初,我们使用 Time to First Byte、DomContentLoaded 和 Load 这些衡量文档加载进度的指标,但它们不能直接反应用户视觉体验。
为了能衡量用户视觉体验,Web 标准中定义了一些性能指标,这些性能指标被各大浏览器标准化实现,例如 First Paint 和 First Contentful Paint。还有一些由 Web 孵化器社区组(WICG)提出的性能指标,如 Largest Contentful Paint 、Time to Interactive、First Input Delay、First CPU Idle。另外还有 Google 提出的 First Meaningful Paint、Speed Index,百度提出的 First Screen Paint。
这些指标之间并不是毫无关联,而是在以用户为中心的目标中不断演进出来的,有的已经不再建议使用、有的被各种测试工具实现、有的则可以作为通用标准有各大浏览器提供的可用于在生产环境测量的 API。