# Web 性能基准 (benchmark)

> 在浏览器中读取 performance.getEntries() 实测页面指标，并与基线对比以发现 Web 性能回归。

- 分类: [性能优化](https://www.myskills.tools/zh/categories/performance/)
- 来源: 社区 · Garry Tan
- 代码仓库: https://github.com/garrytan/gstack/tree/main/benchmark (commit 043feff · v1.0.0)
- SKILL.md: https://github.com/garrytan/gstack/blob/main/benchmark/SKILL.md
- 安装命令: `npx skills add garrytan/gstack --skill benchmark`
- 许可证: MIT
- 兼容工具: Claude Code, Codex, Cursor, Copilot
- 权限: read-repo ✓, write-files ✓, shell ✓, network ✓
- 状态: 扫描通过
- 规则扫描无法覆盖所有风险，安装前请阅读此技能的 SKILL.md，确认权限后再使用。
- ⚠ 可能通过 Aside 使用你已登录的真实浏览器访问目标网站，并通过 gstack 脚本记录遥测数据。

## 核心规则

用实测说话：使用真实的 performance.getEntries() 数据，而不是估算。

## 执行阶段

1. **准备与选页** — 创建 .gstack/benchmark-reports 目录；使用 --pages 指定的页面，或提议首页加最多 5 个导航页并请用户确认；--diff 只测当前分支影响的页面。
2. **采集性能数据** — 每个页面运行 5 次浏览器脚本，获取 TTFB、FCP、LCP、DOM 时间、完整加载、慢资源和 JS/CSS 体积，取中位数并记录范围。
3. **基线与对比** — --baseline 模式保存 baseline.json；否则按阈值与基线比较，差值落在波动范围内则视为无变化。
4. **资源与预算** — 列出最慢的资源并为每项给出一种改进办法，再对 FCP、LCP、JS、CSS、传输量和请求数做预算检查并评级。
5. **趋势与报告** — --trend 显示最近 5 次结果；把 Markdown 和 JSON 报告保存到 .gstack/benchmark-reports 下。

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

| 能力 | 是否需要 | 说明 |
|---|---|---|
| 文件写入 | 部分需要 | 只写入 .gstack/benchmark-reports 下的报告和基线；除非明确要求，否则不修改代码。 |
| 命令执行 | 需要 | 运行 gstack 脚本、git、gh，以及 aside repl 或内置无头浏览器命令来采集数据。 |
| 网络外发 | 部分需要 | 只访问用户指定的目标站点及其同源页面；--diff 模式会通过 gh 查询基础分支。 |

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

```yaml
---
name: benchmark
preamble-tier: 1
version: 1.0.0
description: Web performance regression detection. (gstack)
triggers:
  - web performance benchmark
  - check page speed
  - detect page performance regression
allowed-tools:
  - Bash
  - Read
  - Write
  - Glob
  - AskUserQuestion
---
```

首页: https://www.myskills.tools/zh/ · URL: https://www.myskills.tools/zh/skills/benchmark/