web-performance-optimization

Web Performance Optimization

Detailed Guide

Read the detailed guide before executing this skill. It retains the complete procedure and reference material. Treat its safety, prerequisites, and validation requirements as mandatory. For focused work, load the relevant sections; for end-to-end work, read the guide completely.

When to Use This Skill

• Use when website or app is loading slowly
• Use when optimizing for Core Web Vitals (LCP, INP, CLS)
• Use when reducing JavaScript bundle size
• Use when reducing main-thread blocking and slow interactions (INP)
• Use when optimizing images and assets
• Use when implementing caching strategies
• Use when debugging performance bottlenecks
• Use when preparing for performance audits

Examples below are hypothetical teaching scenarios, not measured results or guaranteed savings. Measure comparable builds/devices/networks and field distributions; do not infer INP from bundle bytes alone. Pin project-compatible tools before installs; preserve originals and review dependency/API changes.