# Lighthouse Audit

> Run Lighthouse performance audits on deployed websites. Checks Performance, Accessibility, Best Practices, and SEO scores.

- **Type:** Skill
- **Install:** `agentstack add skill-itsnex1s-awesome-claude-skills-lighthouse-audit`
- **Verified:** Yes — security-reviewed for prompt injection and unsafe behavior
- **Seller:** [itsnex1s](https://agentstack.voostack.com/s/itsnex1s)
- **Installs:** 0
- **Category:** [Agent Skills](https://agentstack.voostack.com/c/agent-skills)
- **Latest version:** 0.1.0
- **License:** MIT
- **Upstream author:** [itsnex1s](https://github.com/itsnex1s)
- **Source:** https://github.com/itsnex1s/awesome-claude-skills/tree/main/skills/lighthouse-audit

## Install

```sh
agentstack add skill-itsnex1s-awesome-claude-skills-lighthouse-audit
```

Requires the [AgentStack CLI](https://agentstack.voostack.com/docs/cli). Works with Claude Code, Cursor, and any MCP-compatible agent.

## About

# lighthouse-audit

Run Lighthouse performance audits on deployed websites. Checks Performance, Accessibility, Best Practices, and SEO scores.

## Installation

```bash
# Lighthouse CLI (optional, for local audits)
npm install -g lighthouse

# agent-browser for visual testing
npm install -g agent-browser
agent-browser install
```

## Quick Audit (CLI)

```bash
# Run Lighthouse audit
npx lighthouse https://example.com --output=json --output-path=/tmp/report.json

# Extract scores
cat /tmp/report.json | jq '{
  performance: (.categories.performance.score * 100 | round),
  accessibility: (.categories.accessibility.score * 100 | round),
  bestPractices: (.categories["best-practices"].score * 100 | round),
  seo: (.categories.seo.score * 100 | round)
}'
```

## Detailed Audit

```bash
# Full audit with all categories
npx lighthouse https://example.com \
  --output=json \
  --output-path=/tmp/lighthouse.json \
  --chrome-flags="--headless" \
  --only-categories=performance,accessibility,best-practices,seo

# Extract scores and metrics
cat /tmp/lighthouse.json | jq '{
  scores: {
    performance: (.categories.performance.score * 100 | round),
    accessibility: (.categories.accessibility.score * 100 | round),
    bestPractices: (.categories["best-practices"].score * 100 | round),
    seo: (.categories.seo.score * 100 | round)
  },
  metrics: {
    FCP: .audits["first-contentful-paint"].displayValue,
    LCP: .audits["largest-contentful-paint"].displayValue,
    TBT: .audits["total-blocking-time"].displayValue,
    CLS: .audits["cumulative-layout-shift"].displayValue,
    SpeedIndex: .audits["speed-index"].displayValue
  }
}'
```

## PageSpeed Insights (Visual)

```bash
# Open PageSpeed Insights
agent-browser open "https://pagespeed.web.dev/analysis?url=https://example.com" --session lighthouse

# Wait for analysis to complete
sleep 20

# Take screenshot of results
agent-browser screenshot /tmp/lighthouse-results.png --session lighthouse
agent-browser close --session lighthouse
```

## Output Format

### Score Ranges

| Score | Status | Meaning |
|-------|--------|---------|
| 90-100 | Green | Good |
| 50-89 | Orange | Needs Improvement |
| 0-49 | Red | Poor |

### Core Web Vitals

| Metric | Good | Needs Improvement | Poor |
|--------|------|-------------------|------|
| FCP |  3s |
| LCP |  4s |
| TBT |  600ms |
| CLS |  0.25 |

## Common Workflows

### Quick Performance Check
```bash
npx lighthouse https://mysite.com --output=json --quiet | jq '.categories.performance.score * 100'
```

### Mobile vs Desktop
```bash
# Mobile (default)
npx lighthouse https://mysite.com --output=json --output-path=/tmp/mobile.json

# Desktop
npx lighthouse https://mysite.com --output=json --output-path=/tmp/desktop.json --preset=desktop

# Compare
echo "Mobile: $(cat /tmp/mobile.json | jq '.categories.performance.score * 100')%"
echo "Desktop: $(cat /tmp/desktop.json | jq '.categories.performance.score * 100')%"
```

### Find Performance Issues
```bash
# Get failed audits
cat /tmp/lighthouse.json | jq '[.audits | to_entries[] | select(.value.score != null and .value.score < 0.9) | {id: .key, score: .value.score, title: .value.title}] | sort_by(.score) | .[0:10]'
```

### Check Unused JavaScript
```bash
cat /tmp/lighthouse.json | jq '.audits["unused-javascript"].details.items[:5]'
```

### Check LCP Element
```bash
cat /tmp/lighthouse.json | jq '.audits["largest-contentful-paint-element"].details'
```

## Report Options

```bash
# Generate HTML report
npx lighthouse https://example.com --output=html --output-path=./report.html

# Generate both JSON and HTML
npx lighthouse https://example.com --output=json --output=html --output-path=./report

# Specific categories only
npx lighthouse https://example.com --only-categories=performance,seo

# Quiet mode (less output)
npx lighthouse https://example.com --quiet
```

## Automation

### CI/CD Check
```bash
#!/bin/bash
SCORE=$(npx lighthouse https://mysite.com --output=json --quiet | jq '.categories.performance.score * 100')
if (( $(echo "$SCORE < 90" | bc -l) )); then
  echo "Performance score $SCORE is below 90"
  exit 1
fi
echo "Performance score: $SCORE"
```

### Compare Before/After
```bash
# Before changes
npx lighthouse https://mysite.com --output=json --output-path=/tmp/before.json

# After changes
npx lighthouse https://mysite.com --output=json --output-path=/tmp/after.json

# Compare
echo "Before: $(cat /tmp/before.json | jq '.categories.performance.score * 100')%"
echo "After: $(cat /tmp/after.json | jq '.categories.performance.score * 100')%"
```

## Requirements

- Node.js 18+
- Chrome/Chromium (for CLI audits)
- Website must be publicly accessible

## Notes

- Mobile scores are default (throttled 4G, mobile viewport)
- Use `--preset=desktop` for desktop scores
- PageSpeed Insights API has rate limits
- Scores can vary between runs (network conditions, server load)
- Use multiple runs and average for accurate comparison

## Source & license

This open-source skill is cataloged on AgentStack and links to its original source — we do not rehost the code.

- **Author:** [itsnex1s](https://github.com/itsnex1s)
- **Source:** [itsnex1s/awesome-claude-skills](https://github.com/itsnex1s/awesome-claude-skills)
- **License:** MIT

Install and usage instructions live in the source repository linked above.

## Pricing

- **Free** — Free

## Security capabilities

Automated source analysis of v0.1.0 — what this tool can access:

- **Network access:** no
- **Filesystem access:** no
- **Shell / process execution:** no
- **Environment & secrets:** no
- **Dynamic code execution:** no

*"Yes" means the capability is present in the source — more access means more to trust, not that it is unsafe.*


## Versions

- **0.1.0** — security scan: passed — Imported from the upstream source.

## Links

- Listing page: https://agentstack.voostack.com/l/skill-itsnex1s-awesome-claude-skills-lighthouse-audit
- Seller: https://agentstack.voostack.com/s/itsnex1s
- Browse the marketplace: https://agentstack.voostack.com/browse

---
Listed on AgentStack — the marketplace for AI agent skills and MCP servers. Every listing is security-reviewed. Creators keep 70%.