STATUS IS UP赋能 / 中文
交付预算 / 04

优化路径,
然后再测量。

一本实用的性能规划指南,帮助识别最慢的客户路径、设定明确的交付预算,并逐项验证受控改进。

用途: 用于在 HTML、图像、字体、脚本、缓存和关键用户交互上优先处理可衡量的交付工作,而不承诺分数或排名结果。

四个可控杠杆

减少摩擦, 以证据为本。

传输

为最重的资源定尺寸

按交付字节和客户路径重要性审查图像、字体和脚本。仅在可见体验保持正确的前提下移除或延迟工作。

交付

缩短关键请求路径

识别阻塞渲染和依赖源站的请求,然后在受控条件下评估缓存、压缩、预加载或依赖关系变更。

交互

保护响应式输入

检查主要交互周围的长任务和客户端工作。在减少可避免工作时保留语义、无障碍、用户同意和功能行为。

证据

同条件对比

记录 URL、发布、设备、网络、缓存状态和指标来源。只有在相同方法产生更好结果且无回归时,改动才获得信心。

方法 / 源限定

完成下一步 已知步骤。

  1. 选择一个具有代表性的客户路径,并在更改代码前记录当前的实验室和可用现场证据。
  2. 为传输大小、关键请求和与该路径最相关的以用户为中心的指标设定可审查的预算。
  3. 优先处理最大且可控的原因,例如尺寸过大的图像、阻塞渲染的资源、可避免的脚本或响应缓慢的源站。
  4. 只做一个有界的改动,在相同路径与条件下比较,并根据观察到的证据保留或回滚该改动。
验证 / 在依赖之前

使用相同的 URL、设备配置、网络条件和缓存假设对前后结果进行比较。

检查真实页面是否在布局、交互、无障碍、分析和关键客户路径上出现回归。

记录发布标识、观测到的数值、测试条件、决策和如果未保留改动的回滚结果。

权威 / 审查

来源说明, 而非借来的确定性。

规划依据:web.dev 性能与 Core Web Vitals 指南

  • web.dev — Web performance ↗web.dev 建议以用户为中心进行性能测量,理解 Core Web Vitals,并在再次测量前先应用有针对性的改进。
上下文 / 保持交接连接

作者: SIU 启用团队编辑草稿;基于来源的性能指导。 审查者: 性能负责人和客户路径负责人共同审查证据与权衡。 重新验证: 当页面组成、交付基础设施、第三方脚本或测量条件发生变化时重新验证。