Guides
Concrete, technical guides on Core Web Vitals — what each metric measures, how to fix common failures, and how to get your specific stack into the "good" bucket.
Core metrics — what each Core Web Vital measures and how it is calculated
What each metric measures and how it is calculated.
- Core Web Vitals explained (no developer jargon)LCP, INP, CLS — what they are, what "good" looks like, and whether they actually affect your Google rankings.
- What is Largest Contentful Paint (LCP)?Definition, thresholds, how LCP is measured, common causes of slow LCP, and fixes that actually move the number.
- What is Interaction to Next Paint (INP)?INP replaced FID in March 2024. Here is the new metric, the thresholds, and the specific patterns that cause slow INP.
- What is Cumulative Layout Shift (CLS)?Layout stability explained. Thresholds, common causes (images without dimensions, fonts, ads), and the fixes for each.
- What is First Contentful Paint (FCP)?FCP measurement, relationship to LCP, thresholds, and why slow FCP is usually a TTFB or render-blocking problem.
- What is Time to First Byte (TTFB)?Server response timing, the TTFB budget, CDN and edge impact, and how to diagnose a slow TTFB in three minutes.
How to fix common Core Web Vitals failures step by step
Step-by-step fix playbooks for common failures.
- How to fix slow LCP (over 4 seconds)A step-by-step fix sequence: identify the LCP element, optimize images, preload critical resources, reduce render-blocking work.
- How to fix high INP (over 200ms)Find the slow interactions, break up long tasks, audit third-party JavaScript, reduce React re-renders, move work off the main thread.
- How to fix CLS (over 0.1)Image dimensions, ad slot reservation, font swap strategies, cookie banners, dynamic content, and animation best practices.
Framework and stack specific Core Web Vitals optimization notes
Platform-specific optimization notes.
- How to improve LCP in Next.js appsnext/image with priority, static/ISR over SSR, client-component discipline, next/font, edge runtime, and Suspense streaming.
- WordPress Core Web Vitals optimizationThe three fixes that move most WP sites from "poor" to "good": real hosting, a caching plugin, image optimization — plus plugin audits.
- How images hurt LCP (and how to fix)Modern formats, responsive sizing, fetchpriority, preload, and the minimum-viable image checklist for fast LCP.
Context and SEO impact of Core Web Vitals on Google search rankings
How Core Web Vitals relate to Google rankings and measurement.
- CrUX vs Lighthouse — field data vs lab dataWhen to use each, why they disagree, and how to read them together for a complete performance picture.
- Why mobile Core Web Vitals matter more than desktopMobile-first indexing, CPU-constrained devices, and the performance fixes that help mobile disproportionately.
- Does page speed affect Google rankings?The truth: content quality beats speed, but Core Web Vitals are the tiebreaker in competitive SERPs. Here is what matters, in order.
Check any site's vitals
Explore by industry
See how real-world sites in each vertical perform on Core Web Vitals.