# Performance Optimization Checklist
Quick-reference checklist of common performance optimizations, ordered by typical impact-per-effort. Use it as a triage list, not a script. Skip what does not apply.
For symptom-to-fix walkthroughs, see `optimization-playbook.md`. For a structured audit report, see `audit-template.md`.
---
## P0: blocks Core Web Vitals at the 75th percentile
These optimizations almost always pay back. If a site is failing CWV, start here.
### Images
- [ ] LCP image is preloaded with `` tags have explicit `width` and `height` (or `aspect-ratio` CSS)
- [ ] Below-the-fold images use `loading="lazy"`
- [ ] Decorative images use `decoding="async"`
### Fonts
- [ ] Web fonts use `font-display: swap` (or `optional` for layout stability)
- [ ] Font files are woff2 and subsetted to actual glyphs used
- [ ] Critical font files are preloaded
- [ ] Preconnect to font origin if hosted off-domain
### JavaScript on the critical path
- [ ] No render-blocking scripts in `` (use `defer` or `async` or move to `` end)
- [ ] Heavy third-party scripts (chat widgets, A/B test tools, analytics) are deferred until interaction or after load
- [ ] Bundle size budget enforced per route
- [ ] Code split per route or feature
- [ ] Unused JavaScript removed (Coverage tab in DevTools)
### Layout stability
- [ ] No content insertion above the fold after initial render (banners, ads, popups)
- [ ] Skeleton states or placeholders prevent layout shift on async content
- [ ] Avoid `@font-face` with no fallback chain
- [ ] Avoid web fonts that change metrics significantly between fallback and loaded state (use `size-adjust` and `ascent-override`)
---
## P1: significant gains, moderate effort
### Server and network
- [ ] HTTP/2 or HTTP/3 enabled
- [ ] Brotli compression enabled (or gzip if Brotli unavailable)
- [ ] Cache headers correct for static assets: long `max-age` and `immutable` for hashed files
- [ ] CDN in front of origin for static assets (and dynamic where applicable)
- [ ] Origin response time (TTFB) under 800ms at p75
- [ ] DNS prefetch and preconnect for critical third-party origins
### Rendering strategy
- [ ] Above-the-fold content is server-rendered (or static) where possible
- [ ] Critical CSS inlined for above-the-fold
- [ ] Non-critical CSS loaded asynchronously
- [ ] Partial / progressive hydration considered for heavy SPA pages
### Resource loading
- [ ] `