关于 perf
面向开发者的性能分析技能,涵盖代码基准测试、Node.js 分析和 Lighthouse 审计,并可借助 AI 检查代码及性能配置文件。它还提供热点定位和前后对比的操作示例。
主要功能
- 01计时与运行基准测试
- 02分析 Node.js CPU 和内存
- 03生成 Lighthouse 性能审计报告
- 04借助 AI 分析代码与性能配置文件
- 05查找热点并比较优化前后结果
适用场景
- 01测量 Node.js 脚本耗时和内存
- 02定位 CPU 或内存热点
- 03审计网站性能并导出报告
- 04检查代码性能问题并比较优化结果
安装
复制下面的命令,在终端中运行。
$
npx skills add https:/ / github.com/ johnlindquist/ claude --skill perf安装后在 Claude Code 中输入/perf确认已加载。
详细介绍
性能分析器
对代码性能进行分析、基准测试和优化。
前提条件
# Node.js for profiling
node --version
# Lighthouse for web perf
npm install -g lighthouse
# Gemini for analysis
pip install google-generativeai
export GEMINI_API_KEY=your_api_key
基准测试
快速基准测试
# Time a Node.js script
time node script.js
# With memory
/usr/bin/time -l node script.js # macOS
/usr/bin/time -v node script.js # Linux
Node.js 性能钩子
// benchmark.js
const { performance, PerformanceObserver } = require('perf_hooks');
const obs = new PerformanceObserver((list) => {
console.log(list.getEntries()[0].duration);
});
obs.observe({ entryTypes: ['measure'] });
performance.mark('start');
// Code to benchmark
yourFunction();
performance.mark('end');
performance.measure('duration', 'start', 'end');
控制台计时
console.time('operation');
// Code to time
console.timeEnd('operation'); // Prints: operation: 123.456ms
Node.js 性能分析
V8 分析器
# Generate profile
node --prof script.js
# Process the log
node --prof-process isolate-*.log > profile.txt
检查模式
# Start with inspector
node --inspect script.js
# Break on start
node --inspect-brk script.js
# Open Chrome DevTools
open chrome://inspect
内存分析
# Heap snapshot
node --heapsnapshot-signal=SIGUSR2 script.js
# Then: kill -USR2 <pid>
# Expose GC for testing
node --expose-gc script.js
Lighthouse 审计
基础审计
# Full audit
lighthouse https://example.com
# Output to JSON
lighthouse https://example.com --output=json --output-path=report.json
# Output to HTML
lighthouse https://example.com --output=html --output-path=report.html
# Specific categories
lighthouse https://example.com --only-categories=performance
# Mobile vs Desktop
lighthouse https://example.com --preset=desktop
lighthouse https://example.com --preset=mobile # default
仅性能
lighthouse https://example.com \
--only-categories=performance \
--output=json \
--output-path=perf-report.json
Chrome 标志
# Headless
lighthouse https://example.com --chrome-flags="--headless"
# Custom viewport
lighthouse https://example.com --chrome-flags="--window-size=1920,1080"
AI 性能分析
分析代码性能
CODE=$(cat slow-function.ts)
gemini -m pro -o text -e "" "Analyze this code for performance issues:
$CODE
Identify:
1. Time complexity issues
2. Memory leaks or bloat
3. Unnecessary operations
4. Opportunities for optimization
5. Caching opportunities
Provide specific recommendations with code examples."
分析性能分析输出
PROFILE=$(cat profile.txt)
gemini -m pro -o text -e "" "Analyze this Node.js profile:
$PROFILE
Identify:
1. Hot functions (most time spent)
2. Potential bottlenecks
3. Optimization opportunities
4. Priority of fixes"
查找热点
CPU 热点
# Record CPU profile
node --cpu-prof script.js
# Analyze generated .cpuprofile
# Open in Chrome DevTools or use:
npx speedscope *.cpuprofile
内存热点
# Find large objects
node --heapsnapshot-signal=SIGUSR2 app.js
# Use clinic.js
npx clinic doctor -- node script.js
npx clinic flame -- node script.js
npx clinic bubbleprof -- node script.js
打包分析
# Webpack
npx webpack-bundle-analyzer stats.json
# Vite
npx vite build --report
# Generic
du -sh dist/*
ls -lhS dist/*.js
常见模式
需要检查的反模式
gemini -m pro -o text -e "" "Check this code for common performance anti-patterns:
$(cat src/*.ts)
Look for:
- Synchronous I/O in hot paths
- Repeated DOM queries
- Unnecessary re-renders
- N+1 query patterns
- Memory leaks in closures
- Blocking the event loop"
优化清单
gemini -m pro -o text -e "" "Create a performance optimization checklist for:
Application type: [web app / API / CLI]
Stack: [your stack]
Current issues: [symptoms]
Include priority order and estimated impact."
对比基准测试
优化前/优化后
#!/bin/bash
# benchmark-compare.sh
echo "=== Before optimization ==="
git checkout main
npm install
time npm run benchmark
echo "=== After optimization ==="
git checkout optimization-branch
npm install
time npm run benchmark
A/B 脚本
#!/bin/bash
# Run same benchmark multiple times
for i in {1..10}; do
echo "Run $i:"
node benchmark.js
done | tee results.txt
# Calculate average
grep "time:" results.txt | awk '{sum+=$2; n++} END {print "Average:", sum/n}'
最佳实践
- 先测量 - 没有数据就不要优化
- 在生产环境分析 - 开发环境性能不同
- 自动化基准测试 - 长期跟踪
- 聚焦热点路径 - 80/20 法则
- 在目标设备上测试 - 尤其是移动端
- 部署后监控 - 验证改进效果
- 记录基线 - 了解"良好"的标准
评论
支持 Markdown