Performance Optimization Skill
Purpose
Expert knowledge in optimizing web performance focusing on Core Web Vitals, bundle size reduction, and efficient caching strategies.
Core Principles
- Measure First - Use Lighthouse/PageSpeed Insights
- Core Web Vitals - LCP < 2.5s, FID < 100ms, CLS < 0.1
- Progressive Enhancement - Core functionality works everywhere
- Lazy Loading - Load content as needed
- Caching Strategy - Maximize cache hits
Enforces
- Core Web Vitals targets:
- LCP (Largest Contentful Paint) < 2.5s - FID (First Input Delay) < 100ms - CLS (Cumulative Layout Shift) < 0.1
- Bundle size optimization (< 100KB initial)
- Image optimization (WebP, lazy loading)
- HTTP caching headers
- CDN optimization
- Code splitting and tree shaking
Optimization Strategies
- Lazy load images and charts
- Defer non-critical JavaScript
- Use browser caching (Cache-Control, ETag)
- Minify HTML/CSS/JavaScript
- Optimize images (compression, modern formats)
- Implement service workers for offline
When to Use
- Performance tuning
- Bundle size reduction
- Load time optimization
- Core Web Vitals improvement
- Caching strategy design
References
Version: 1.0 | Last Updated: 2026-02-06 | Category: Development & Operations