claudeskills.page

Collection · 10 skills

Web Performance Kit

Find the real bottleneck with field data, pick the right rendering strategy per route, shrink what ships, serve images and fonts properly, cache aggressively, shorten server time, and lock the gains in with performance budgets in CI.

Best for Frontend and full-stack engineers responsible for page speed and SEO.

What's inside

Listed in the order we suggest adopting them. You don't call them by name: each skill loads on its own when a request matches it.

  1. Core Web Vitals Fix the sub-part that is actually slow Performance core-web-vitals 190 lines
  2. Rendering Strategies Static where you can, per-request only where you must Performance rendering-strategies 207 lines
  3. Bundle Analysis Cut the initial JS users actually download Performance bundle-analysis 184 lines
  4. Image Optimization Right size, modern format, loaded at the right time Performance image-optimization 176 lines
  5. Web Font Loading Fonts that arrive early and move nothing when they swap Performance web-font-loading 230 lines
  6. HTTP Caching Year-long assets, always-fresh HTML, zero leaks Performance http-caching 163 lines
  7. TTFB Optimization Find the slow phase of the first byte, then fix only that Performance ttfb-optimization 180 lines
  8. React Re-renders Profile first, memoize last Performance react-rerenders 199 lines
  9. Lighthouse CI Fail the PR when pages get slower, not later Performance lighthouse-ci 173 lines
  10. Web Workers Get heavy computation off the main thread, measured Performance web-workers 230 lines

Keep exploring

Other collections

All collections →
esc