# 在 CI 中执行性能预算 (performance-budget)

> 在 CI 中设定包体积和 Lighthouse 阈值，超出预算即失败，在 PR 阶段发现性能回退。

- 分类: [性能优化](https://www.myskills.tools/zh/categories/performance/)
- 来源: 社区 · David Dias
- 代码仓库: https://github.com/thedaviddias/Front-End-Checklist/tree/main/skills/performance-budget (commit 4b0ddb9)
- SKILL.md: https://github.com/thedaviddias/Front-End-Checklist/blob/main/skills/performance-budget/SKILL.md
- 安装命令: `npx skills add thedaviddias/Front-End-Checklist --skill performance-budget`
- 许可证: MIT
- 兼容工具: Any SKILL.md agent
- 权限: read-repo ✓, write-files ✓, shell ✓, network ✓
- 状态: 扫描通过
- 规则扫描无法覆盖所有风险，安装前请阅读此技能的 SKILL.md，确认权限后再使用。

## 核心规则

区分包体积预算和运行时预算（Lighthouse、Core Web Vitals），两者都要执行。

## 执行阶段

1. **检查是否有预算** — 在 package.json 和 CI 配置中查找体积或 Lighthouse 阈值。
2. **设定阈值** — 明确最大包体积、最低 Lighthouse 分数和最大 LCP，先宽后严逐步收紧。
3. **接入 CI** — 用 size-limit 和 Lighthouse CI 断言在 PR 上执行预算，超出即让构建失败。
4. **上线后监控** — 接入生产环境 RUM 和告警，发现 CI 之外的回退。

## 权限说明（据 SKILL.md 整理）

| 能力 | 是否需要 | 说明 |
|---|---|---|
| 文件写入 | 需要 | 修改 CI 工作流、package.json 及 size-limit、Lighthouse CI 配置。 |
| 命令执行 | 部分需要 | 安装并运行 size-limit、Lighthouse CI 等预算工具。 |
| 网络外发 | 部分需要 | 仅用于安装开发依赖。 |

## SKILL.md 头部信息（YAML）

```yaml
---
name: performance-budget
description: "Use when reviewing CI configuration, bundle analysis workflows, or pull requests that add dependencies and assets. Distinguish bundle-size budgets from runtime budgets such as Lighthouse or Core Web Vitals so teams can enforce both."
metadata:
  category: testing
  priority: medium
  difficulty: intermediate
  estimatedTime: "25"
  source: frontendchecklist.io
  url: https://frontendchecklist.io/rules/testing/performance-budget
---
```

首页: https://www.myskills.tools/zh/ · URL: https://www.myskills.tools/zh/skills/performance-budget/