Lighthouse Audit

Overview

Audit one or more local routes with Lighthouse, then summarize key metrics and optional DevTools MCP performance traces.

Inputs to confirm

• baseUrl: default http://localhost:3000
• routes: list of paths (e.g. /pricing) or full URLs
• preset: mobile (default) or desktop
• runs: optional repeat count for more stable scores
• mode: dev (pnpm dev) or prod (pnpm build && pnpm start)

If the user says "new page", ask for the route if it is not already known.

Workflow

1. Ensure the local server is running
   • Prefer production-like results: pnpm build && pnpm start
   • Quick iteration: pnpm dev
2. Run Lighthouse CLI via the bundled script
   • Single route: python3 .claude/skills/lighthouse-audit/scripts/run_lighthouse.py --route "/pricing"
   • Multiple routes: python3 .claude/skills/lighthouse-audit/scripts/run_lighthouse.py --routes "/,/pricing,/blog" --preset desktop --runs 3
   • Full URL: python3 .claude/skills/lighthouse-audit/scripts/run_lighthouse.py --url "http://localhost:3000/pricing"
   • Reports are written under /.lighthouse/<slug>/<preset>/<timestamp>/report.json
3. Optional: capture a DevTools MCP performance trace for deeper analysis
   • mcp__chrome-devtools__new_page to open the URL
   • mcp__chrome-devtools__performance_start_trace with reload: true, then mcp__chrome-devtools__performance_stop_trace
   • Use trace insights to explain bottlenecks that align with Lighthouse findings
4. Report results
   • Provide performance score and key metrics (FCP, LCP, CLS, TBT, Speed Index, TTI/INP)
   • Call out regressions vs previous runs when available
   • Suggest fixes tied to the worst metrics

Resources

• scripts/run_lighthouse.py: runs Lighthouse locally and prints a metric summary