LCP (Largest Contentful Paint)
What is LCP (Largest Contentful Paint)?
LCP (Largest Contentful Paint) measures when the largest above-the-fold content element, typically a hero image, a banner, or a large heading, finishes rendering from the user's perspective. It is the primary loading performance metric in Google's Core Web Vitals suite. Google defines LCP thresholds as: Good < 2.5s, Needs Improvement 2.5s–4.0s, Poor > 4.0s. For mobile web and PWA testing, LCP is particularly critical because mobile connections are slower and mobile CPUs process paint operations more slowly than desktop. The most common LCP optimisation levers are: server-side rendering the above-the-fold content, preloading the LCP image element, and using next-gen image formats (WebP, AVIF).
Related terms
LCP (Largest Contentful Paint), frequently asked questions
Google defines a good LCP as under 2.5 seconds, measured at the 75th percentile of real user sessions (p75). For mobile-first sites, the target should be under 2.0 seconds at p75 on a mid-range Android device on a 4G connection, as this reflects the median user in most markets. LCP above 4.0s is classified as poor and negatively impacts search ranking.
The highest-impact LCP optimisations: (1) Preload the LCP image with <link rel='preload'>. (2) Use next/image or equivalent with explicit dimensions and priority to prevent layout recalculation. (3) Server-render or statically generate the above-the-fold HTML so the browser doesn't wait for client JS. (4) Self-host fonts with font-display: swap to avoid text being blocked. (5) Use WebP or AVIF format images, typically 30–50% smaller than JPEG at equivalent quality.