web-performance-audit

# 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 ```javascript // 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 ```javascript 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 ...