广泛部署的技术

Web 性能工作组开发了一些规范,它们向 Web 应用提供计时 API,用于分析各任务耗费的时间。

高解析度时间将单调的亚毫秒级解析度时钟 API 提供给Web应用,以便 Web 应用可以精确地测量两个事件之间的时间间隔。性能时间线定义了一个统一的界面来存储和检索性能指标数据。单独的性能指标接口在不同的规范中定义:

  • 导航计时提供导航和元素相关的计时信息;
  • 资源计时提供文档中资源的计时信息;
  • 用户计时帮助应用程序使用高解析度时间戳测量性能。

用于确定是否正在显示网页的页面可见性API也可用于使资源的使用适应 Web 应用的需要,例如通过在页面最小化时减少网络活动。

基于脚本的动画时间控制 API 可以帮助减少播放动画时的资源使用量。

除了优化资源之外,应用程序的感知反应性也是移动用户体验的一个关键方面。通过 Web Workers 实现的类似于线程的机制允许通过将最耗费资源的操作卸载到后台进程来保持用户界面的响应。

移动 Web 应用最佳实践提供有关如何构建可在移动设备上良好运行的 Web 应用的通用建议,并特别考虑优化的需求。

特性规范成熟度现有实现
计时 API高解析度时间 (High Resolution Time)REC

已有稳定实现
shipped in firefoxshipped in chromeshipped in edgeshipped in safari

性能时间线 (Performance Timeline)REC

导航计时 (Navigation Timing)REC

已有稳定实现
shipped in firefoxshipped in chromeshipped in edgeshipped in safari

资源计时第一版 (Resource Timing Level 1)CR

已有稳定实现
shipped in firefoxshipped in chromeshipped in edgeshipped in safari

用户计时 (User Timing)REC

已有稳定实现
shipped in firefoxshipped in chromeshipped in edgeshipped in safari

页面可见性检测页面可见性 (Page Visibility)REC

已有稳定实现
shipped in firefoxshipped in chromeshipped in edgeshipped in safari

动画优化HTML 5.1中的requestAnimationFrameREC

已有稳定实现
shipped in firefoxshipped in chromeshipped in edgeshipped in safari

线程HTML (Living Standard)中的Web workersLS

已有稳定实现
shipped in firefoxshipped in chromeshipped in edgeshipped in safari

优化最佳实践移动 Web 应用最佳实践 (Mobile Web Application Best Practices)REC

开发中的技术

资源提示预加载规范使开发人员能够通过延迟下载或执行下载的资源来优化资源的下载。

后台任务协同调度规范定义了 requestIdleCallback 方法,该方法允许在应用未处理其他操作的下一个机会中调度操作。

Service Workers 规范定义了一种机制,允许应用拦截传出的网络请求并直接对其进行响应。应用可以利用这种机制直接实现灵活的缓存逻辑,从而避免了对服务器的冗长请求。

电池状态 API 允许根据移动设备电池中当前可用的电力水平调整资源的使用。请注意,此规范的未来还不确定,因为它有潜在的隐私侵犯用途

服务器计时使服务器能够将有关请求-响应周期的性能指标传达给用户代理,并允许应用根据这些指标来优化应用响应时间。

长任务 API 提供了一种对在长时间内垄断用户界面主线程的长任务的检测机制。

绘制计时规范允许应用程序在页面加载过程中捕捉一系列关键时刻,例如第一次绘制和第一次内容丰富​​的绘制。

Web 汇编是一种低级别的字节码格式,它在网络浏览器中可以以接近本机的速度运行,并支持从C/C++和其他语言进行编译。它还定义了一个试图最大限度地提高性能的执行环境,并与 JavaScript 和 Web 进行良性合作,确保各种实现的安全性和行为一致性。

在移动设备上使用无限滚动列表(在用户滚动时加载和呈现越来越多的内容)非常常见。这样的列表提供比触摸屏上的分页更好的用户体验。不幸的是,应用程序需要不断地同步轮询 DOM 元素的布局信息来实现这个模式,这是一个性能开销的重要来源。交叉观察器规范定义了一个 API,用于异步观察目标元素与祖先元素或顶层文档视图的交集中的变化,从而提供一种有效的机制来检索实现无限滚动所需的信息。

特性规范成熟度现有实现
网络优先级资源提示 (Resource Hints)WD

考虑实现
consideration in edge

已有实验性实现
experimental in safari

已有稳定实现
shipped in firefoxshipped in chrome

预加载 (Preload)CR

已有实验性实现
experimental in firefoxexperimental in safari

已有稳定实现
shipped in chrome

本地优先级处理后台任务协同调度 (Cooperative Scheduling of Background Tasks)PR

考虑实现
consideration in edge

已有稳定实现
shipped in firefoxshipped in chrome

缓存Service Workers 1WD

已有实验性实现
experimental in safari

开发中
indevelopment in edge

已有稳定实现
shipped in firefoxshipped in chrome

电池状态电池状态 API (Battery Status API)CR

已有稳定实现
shipped in chrome

计时 API服务器计时 (Server Timing)WD

长任务 API 第一版 (Long Tasks API 1)WD

绘制计时第一版 (Paint Timing 1)WD

考虑实现
consideration in edgeconsideration in safari

已有稳定实现
shipped in chrome

底层字节码格式Web 汇编 (WebAssembly)ED

已有实验性实现
experimental in edge

已有稳定实现
shipped in firefoxshipped in chromeshipped in safari

无限滚动交叉观察器 (Intersection Observer)WD

开发中
indevelopment in safari

已有稳定实现
shipped in firefoxshipped in chromeshipped in edge

Polyfills

探索性工作

帧计时 API 的工作旨在提供应用在用户设备上运行时获得的每秒帧数的详细信息。

特性规范小组实现意向
渲染性能帧计时 (Frame Timing)Web 性能工作组 (Web Performance Working Group)

目前尚未覆盖的工作

更加精细的网络优化
现有指定资源获取优先级的机制是非常粗糙的,比如 preload 链接类型。应用可以从指定用户代理最终需要获取的资源的相对优先级的声明性机制中获益。Web平台孵化社区组目前的讨论可能存在这个领域的探索性工作。