← ClaudeAtlas

web-performancelisted

Use this skill whenever the user is improving Core Web Vitals or page load performance, or mentions slow pages, PageSpeed Insights / Lighthouse failures, LCP/CLS/INP scores, bundle size, image/font optimization, or third-party script impact. Covers Core Web Vitals, image and font optimization, JavaScript bundle size, CSS build size, CDN caching, third-party JavaScript impact, and measurement tools. Skip for backend latency tuning, database query optimization, or CI build speed.
ziniman/ai-instruct · ★ 20 · Web & Frontend · score 81
Install: claude install-skill ziniman/ai-instruct
# Web Performance Guide > Applies to: Any website or web app | Updated: March 2026 A practical reference for measuring and improving web performance - covering Core Web Vitals, image and font optimization, JavaScript bundle size, CSS build size, CDN caching, third-party JavaScript impact, and validation tools. --- ## Section 0: Before You Start Answer these questions before making any performance changes. Each has a default - use it if the user hasn't said otherwise. **Q: Which pages are the priority targets?** (landing page, dashboard, auth-gated app pages, all pages) Default: public-facing pages first - these are indexed by search engines and directly affect user experience. Auth-gated pages matter less for Core Web Vitals field data because CrUX only collects data from logged-in users on those routes. **Q: What is the current performance baseline?** Default: unknown - run PageSpeed Insights on the target URL before making any changes, so you have a before/after comparison. Note the LCP element type (image or text), TTFB, and the specific audits flagged as failing. **Q: Are you optimizing for lab scores (Lighthouse) or field data (real users)?** Default: both - but prioritize fixing field data issues flagged in Google Search Console > Core Web Vitals first. Lab scores are easier to game; field data reflects real users on real devices and networks. **Q: What framework or rendering model is the site using?** (plain HTML, SPA/Vite, Next.js App Router, Astro, Nuxt, Wor