---
name: performance-audit
version: 1.0.0
description: "分析并优化应用性能。当用户报告页面慢、加载卡或包体积大时使用。涵盖前端渲染、网络、打包和数据库四个维度。"
---

> ⚠️ 核心执行流程已在 `.cursor/rules/022-performance.mdc` 中由 Cursor 自动注入。
> 本文件提供完整模板、代码示例和边缘场景处理，供 Agent 按需深入 Read。

# Performance Audit

## 触发条件

用户报告性能问题、请求性能优化或要求性能审计。

## 执行流程

### 1. 性能基线

收集当前数据：
```bash
# 前端打包分析 (Vite)
for dir in Case-Database-Frontend-user Case-Database-Frontend-admin; do
  echo "=== $dir ==="
  cd $dir && npm run build 2>&1 | tail -20
  du -sh dist/
  cd ..
done

# 后端状态
cd Case-Database-Backend && php bin/hyperf.php describe:routes | wc -l
```

### 2. 四维度审计

**前端渲染**
- Vue DevTools 分析不必要的重渲染
- 检查大列表是否缺少 `v-memo` / `shallowRef`
- 检查大列表是否使用虚拟化（`@tanstack/vue-virtual`）
- 检查图片是否压缩（WebP 格式 + CDN）
- 管理端：Element Plus 是否按需导入（用户端不使用 Element Plus）

**网络请求**
- 是否有瀑布式请求（串行 → 并行）
- API 响应是否有 Redis 缓存策略
- Axios 是否配置请求/响应拦截
- 静态内容是否配置 Nginx 缓存

**打包体积**
- 是否有不必要的大依赖
- 是否使用 dynamic import 进行代码分割
- 是否 tree-shaking 有效
- 检查 barrel exports 是否导致全量导入

**数据库查询**
- N+1 查询检测
- 缺少索引的慢查询
- 未使用 `select` 限制字段
- 大数据集未分页

### 3. Core Web Vitals 目标

| 指标 | 目标 | 说明 |
|------|------|------|
| LCP | < 2.5s | Largest Contentful Paint |
| INP | < 200ms | Interaction to Next Paint |
| CLS | < 0.1 | Cumulative Layout Shift |
| FCP | < 1.8s | First Contentful Paint |
| TTFB | < 800ms | Time to First Byte |

### 4. 输出优化建议

按影响力排序，每个建议包含：预期收益 + 实施难度 + 具体代码。

## 验证

1. [ ] 优化前后有可量化对比
2. [ ] 未引入功能回归
3. [ ] Core Web Vitals 达标