多年来，页面速度已成为 SEO 和 UX 的重要指标， 网络性能预算 也已成为焦点。现在更加明显的是，Web 性能是一个需要所有部门共同关注的话题，而不仅仅是某个部门或个人的优先事项。
举个例子来解释一下：营销部门可能希望实现转换和 再营销/重定向代码以及诸如 Criteo 和 RTB House，这些公司使用基于产品的重定向。他们可能还希望看到引人注目的照片和动画。同时，产品部门可能会要求集成以下工具： Hotjar 和 Clarity而软件部门则希望前端和后端都能够尽可能快地开发。页面速度的需求和与这些需求相关的成本实际上是平衡的。Web 性能预算的出现就是为了有效地建立这种平衡。
Web 性能预算涉及在特定平台上为您的平台设定目标速度，并建立所有利益相关者为实现此速度而必须遵守的数字目标。简而言之，快速的代价就是 Web 性能预算。
一切始于一个主张。您可以提议在特定类型的连接上您的页面应该以多快的速度打开。例如，一些性能预算建议可能是：
- 主页能打开吗 在高速 2G 移动连接（3 Mbps）下，耗时不到 1.6 秒?
- 搜索结果页面是否可以在 在较慢的 5G 连接（3 Kbps）上不到 780 秒?
接下来，您要创建一个行动计划和子指标来实现这些主张，并将其分解成几个部分。
除了提案之外，还可以有其他绩效预算目标。例如：
- 增加移动灯塔 详情页得分高于 80
- 减小所有图像的尺寸 桌面网站大小降至 500 KB 以下
绩效预算指标
确定绩效预算的指标有三种不同的观点：
基于数字的指标
- 最大字体数量/最大字体大小
- 最大图像数量/最大图像尺寸
- 脚本、样式、视频等的最大数量 / 脚本、样式、视频等的最大大小
- 最大 HTML 大小
- 最大 HTTP 请求数
- 第三方脚本的最大数量
基于时间的指标
- 首次内容绘制 (FCP) 时间
- 最大内容绘制 (LCP) 时间
- 首次输入延迟 (FID) 时间
- 交互时间 (TTI)
- 总阻塞时间 (TBT) 时间
- 累积布局偏移 (CLS) 得分
- 速度指数得分
基于规则的指标
- 灯塔评分
- GTmetrix 评分
- 网页测试分数
- Yslow 评分
在设置 Web 性能预算时，通常建议以正确的方式结合所有这些角度，而不是只选择一个。您可以使用 绩效预算模拟器 找到达到目标速度所需的数字。
分别评估页面类型
确定性能预算时的一个关键点是不要以网站的单个页面为依据。一个常见的错误是只测试主页，这会导致评估不完整。
您应该首先检查平台并识别不同类型的页面。然后，分析平台的流量以识别接收流量最多的页面并对其进行优先排序。结果将是类似于以下的表格：
- 首页
- 静态列表页面
- 动态列表页面
- 详细信息页面
- 结帐页面
- 搜索结果页面
- 活动页面
- 博客页面
你需要关注 这些页面类型的性能预算分别，根据优先级。
