Core Web Vitals Optimization Checklist

A technical checklist to improve LCP, CLS, and INP—so your site feels fast, stable, and responsive for users and search.

Answer capsule: Improve Core Web Vitals by optimizing LCP (hero images, server response, critical CSS), CLS (explicit dimensions, font loading), and INP (break up long tasks, defer non-critical JS). Use this checklist during build and before every major release. Largest Contentful Paint (LCP) — target under 2.5s ☐ Hero/above-fold images in WebP/AVIF with responsive srcset ☐ Preload LCP image or critical font ☐ Server response time (TTFB) under 800ms ☐ Critical CSS inlined or loaded first ☐ CDN for static assets ☐ Lazy-load below-the-fold images and iframes Cumulative Layout Shift (CLS) — target under 0.1 ☐ Width and height set on images and embeds ☐ Reserve space for ads, banners, cookie bars ☐ Font-display: swap or optional; preload key fonts ☐ Avoid injecting content above existing content after load ☐ Animations use transform/opacity, not layout properties Interaction to Next Paint (INP) — target under 200ms ☐ Break JavaScript tasks longer than 50ms ☐ Defer non-critical third-party scripts ☐ Minimize main-thread work on interaction handlers ☐ Use web workers for heavy computation where possible ☐ Test interactions on mid-range mobile devices Monitoring and regression prevention