lighthouse-audit

Lighthouse Audit

自动执行 Google Lighthouse 审计，以衡量和跟踪 Core Web Vitals、SEO 和无障碍性——这些也是 Google 用于搜索排名的指标。

何时使用此技能

• 性能优化 - 衡量变更前后的 LCP、FID、CLS
• SEO 审计 - 检查技术 SEO 问题（元标签、结构化数据等）
• 无障碍检查 - 识别无障碍问题，确保符合规范
• 客户报告 - 生成专业的性能报告
• 监控 - 跟踪多个页面的评分变化

Claude 做什么，哪些由你决定

Claude 做什么	由你决定
构建分析框架	指标定义
识别数据中的模式	业务解读
创建可视化模板	仪表板设计
建议优化方向	行动优先级
计算统计指标	决策阈值

依赖项

pip install click pandas jinja2
# Also requires Chrome and Lighthouse CLI
# npm install -g lighthouse
# Or use Chrome DevTools built-in Lighthouse

命令

单个 URL 审计

python scripts/main.py audit https://example.com --categories performance,seo
python scripts/main.py audit https://example.com --format html --output report.html

批量审计

python scripts/main.py batch urls.txt --output results/
python scripts/main.py batch urls.txt --categories performance --format csv

对比前后结果

python scripts/main.py compare https://example.com --baseline scores.json
python scripts/main.py compare https://example.com --baseline-url https://staging.example.com

随时间监控

python scripts/main.py history https://example.com --days 30
python scripts/main.py history https://example.com --plot

示例

示例 1：全站性能审计

# Create URL list
cat > urls.txt << EOF
https://example.com/
https://example.com/pricing
https://example.com/features
https://example.com/blog
EOF

# Run batch audit
python scripts/main.py batch urls.txt --categories performance,seo,accessibility

# Output: results/audit_2024-01-15/
# ├── example.com_.json
# ├── example.com_pricing.json
# ├── example.com_features.json
# ├── example.com_blog.json
# └── summary.csv

示例 2：前后结果对比

# Save baseline
python scripts/main.py audit https://example.com --output baseline.json

# Make optimizations...

# Compare
python scripts/main.py compare https://example.com --baseline baseline.json

# Output:
# Core Web Vitals Comparison
# ─────────────────────────────
# Metric         Before    After    Change
# LCP            3.2s      1.8s     -44% ✓
# FID            120ms     45ms     -63% ✓
# CLS            0.25      0.08     -68% ✓
# Performance    52        89       +37 pts

示例 3：生成客户报告

# Full audit with HTML report
python scripts/main.py audit https://client-site.com \
  --format html \
  --output client-report.html \
  --include-screenshots

# Output: Professional HTML report with:
# - Executive summary
# - Core Web Vitals scores
# - Screenshots of issues
# - Prioritized recommendations

审计类别

类别	检查项	影响
performance	LCP、FID、CLS、TTFB、Speed Index	搜索排名
seo	元标签、标题、链接、移动设备	搜索可见度
accessibility	WCAG 合规性、对比度、标签	合规性
best-practices	HTTPS、安全性、现代 API	信任度
pwa	Service Worker、清单、离线功能	类应用体验

Core Web Vitals 阈值

指标	良好	需要改进	较差
LCP（最大内容绘制）	≤2.5s	2.5s-4.0s	>4.0s
FID（首次输入延迟）	≤100ms	100ms-300ms	>300ms
CLS（累积布局偏移）	≤0.1	0.1-0.25	>0.25
INP（与下一次绘制的交互）	≤200ms	200ms-500ms	>500ms

输出格式

格式	用途	内容
json	自动化、存储	完整原始数据
csv	电子表格、分析	汇总评分
html	客户报告	可视化报告
md	文档	Markdown 摘要

技能边界

此技能的优势

• 构建数据分析框架
• 识别模式和趋势
• 创建可视化框架
• 计算统计指标

此技能无法做到

• 访问你的实际数据
• 替代统计专业知识
• 做出业务决策
• 保证预测准确性

相关技能

• schema-markup - 修复结构化数据问题
• image-batch - 优化图片以改善 LCP
• link-checker - 查找失效链接

技能元数据

• 模式：centaur

category: seo-tools
subcategory: performance
dependencies: [lighthouse, click, pandas]
difficulty: beginner
time_saved: 3+ hours/week