TechnicalLCP

Largest Contentful Paint

A Core Web Vital measuring the render time of the largest image, video poster or text block visible in the viewport; good is 2.5 s or less at p75.

In full

LCP decomposes into time to first byte, resource load delay, resource load duration and element render delay, and the biggest wins usually come from the first two. Typical fixes are faster server or edge responses, preloading the LCP image with fetchpriority=high, avoiding lazy-loading above the fold, and eliminating render-blocking CSS and fonts. Because LCP is measured in the field, lab scores from Lighthouse are a diagnostic aid rather than the metric itself.

Example

Removing `loading="lazy"` from a hero image and adding `fetchpriority="high"` cuts p75 LCP from 4.1 s to 2.2 s.

Related terms

Core Web Vitals

Google's set of three field-measured user experience metrics — LCP, INP and CLS — used as part of the page experience signals in ranking.

Time to First Byte

The interval between a navigation request starting and the first byte of the response arriving; a foundational input to LCP and a signal…

Lazy loading

Deferring the download of offscreen images and iframes until they are near the viewport, using the native `loading="lazy"` attribute or…

Preload

A resource hint that tells the browser to fetch a critical resource for the current page at high priority, before the parser would…

Render-blocking resources

Stylesheets and synchronous scripts in the head that must be downloaded and processed before the browser can paint anything.

Where to read more