Web performance audit

Skill secondsky/claude-skills/plugins/web-performance-audit/skills/web-performance-audit

Web performance audits with Core Web Vitals, bottleneck identification, optimization recommendations. Use for page load times, performance reviews, UX optimization, or encountering LCP, FID, CLS issues, resource blocking, render delays.From its SKILL.md

Install

npx -y skills add secondsky/claude-skills --skill web-performance-audit

Assembled from the repository path, not quoted from the project. Check it against their README if it does not work.

What its file declares

Copied from the file, not written here

The file declares its own license as MIT. That is the author’s claim about this one file, and it is not the same thing as the license GitHub reports for the repository, which is listed with the other numbers below.

SKILL.md

2.5 KB, 616 tokens by cl100k_base, as published. Nobody here has run it

Web Performance Audit

Conduct comprehensive performance audits and implement optimizations.

Core Web Vitals Targets

Metric	Good	Needs Improvement	Poor
LCP (Largest Contentful Paint)	<2.5s	2.5-4s	>4s
FID (First Input Delay)	<100ms	100-300ms	>300ms
CLS (Cumulative Layout Shift)	<0.1	0.1-0.25	>0.25
INP (Interaction to Next Paint)	<200ms	200-500ms	>500ms

Performance Measurement

// Using web-vitals library
import { getCLS, getFID, getLCP, getTTFB } from 'web-vitals';

function sendToAnalytics({ name, value, id }) {
  console.log({ name, value, id });
}

getCLS(sendToAnalytics);
getFID(sendToAnalytics);
getLCP(sendToAnalytics);
getTTFB(sendToAnalytics);

Lighthouse Automation

const lighthouse = require('lighthouse');
const chromeLauncher = require('chrome-launcher');

async function runAudit(url) {
  const chrome = await chromeLauncher.launch({ chromeFlags: ['--headless'] });
  const result = await lighthouse(url, {
    port: chrome.port,
    onlyCategories: ['performance']
  });

  await chrome.kill();
  return result.lhr;
}

Optimization Strategies

Quick Wins (1-2 days)

Enable gzip/brotli compression
Minify CSS/JS
Defer non-critical scripts
Optimize images (WebP, lazy loading)

Medium Effort (1-2 weeks)

Implement code splitting
Add service worker caching
Preload critical resources
Eliminate render-blocking resources

Long-term (1-3 months)

Architecture improvements
CDN optimization
Database query optimization

Performance Budget

{
  "timings": [
    { "metric": "first-contentful-paint", "budget": 1500 },
    { "metric": "largest-contentful-paint", "budget": 2500 }
  ],
  "resourceSizes": [
    { "resourceType": "script", "budget": 150 },
    { "resourceType": "image", "budget": 300 }
  ]
}

Audit Checklist

Measure baseline Core Web Vitals
Run Lighthouse audit (mobile & desktop)
Analyze real user metrics (RUM)
Identify largest contentful element
Check for layout shifts
Review JavaScript bundle size
Test on slow 3G connection
Set performance budget
Configure monitoring alerts

What ships with it

Read from the repository

Just SKILL.md. No reference files, no scripts.