Largest Contentful Paint (LCP)
A Core Web Vitals metric that records when the largest image or text block in the viewport finishes rendering after navigation starts.
LCP reflects how quickly visitors see the main content they came for, such as a hero image or product photo, so slow values are linked to abandoned visits on landing pages and paid traffic destinations.
A landing page reports a field LCP of 4.1 seconds on mobile. The team serves the hero image in AVIF from a CDN, adds fetchpriority="high", removes a render-blocking font file, and the 75th percentile drops to 2.3 seconds.
LCP captures one moment and says nothing about interactivity or layout stability. Lab tools such as Lighthouse can differ from field data, and the element counted as largest may change between devices and screen sizes.
LCP reports the render time of the largest visible element relative to when the user started navigating. Eligible elements include images, images inside SVG, video poster images or first frames, elements with url() background images and block-level text. Thresholds are 2.5 seconds or less for good and above 4 seconds for poor, assessed at the 75th percentile of page loads split by mobile and desktop. It is one of the three Core Web Vitals.
Experience Design, Systems Architecture
web.dev — Largest Contentful Paint (LCP) — https://web.dev/articles/lcp; Google Search Central — Understanding Core Web Vitals and Google search results — https://developers.google.com/search/docs/appearance/core-web-vitals
