Quick answer
Largest Contentful Paint (LCP) is a Core Web Vital that measures the time from when a page starts loading until the largest image, video poster or text block in the viewport has rendered. Good is 2.5 seconds or less.
Formula: LCP = TTFB + resource load delay + resource load duration + element render delay
What is Largest Contentful Paint?
Largest Contentful Paint (LCP) is the moment the main content of a page appears: the time from the start of navigation until the largest image or text block visible in the viewport has rendered. It is one of the three Core Web Vitals.
| Rating | LCP |
|---|---|
| Good | 2.5 s or less |
| Needs improvement | 2.5–4 s |
| Poor | over 4 s |
Judge it at the 75th percentile of real visits, so three out of four loads must be good.
The four parts of LCP
Every LCP time splits into four parts, and each has its own fixes:
| Part | What it covers | Typical fix |
|---|---|---|
| Time to first byte | Server response | Caching, a CDN, faster back end |
| Resource load delay | Time before the browser even starts fetching the LCP image | Put the image in the HTML, preload it, fetchpriority="high", do not lazy-load it |
| Resource load duration | Downloading the image | Smaller files, modern formats (AVIF, WebP), right-sized srcset |
| Element render delay | Time from downloaded to painted | Less render-blocking CSS and JavaScript |
A sample product page
Sample data: product pages on mobile have a P75 LCP of 3.4 s (needs improvement). Broken down: 0.9 s first byte, 1.1 s load delay, 0.9 s download and 0.5 s render delay. The hero image is set by JavaScript after the page script runs, and it is lazy-loaded.
Moving the image into the HTML, removing loading="lazy" and adding fetchpriority="high" cuts the load delay to 0.2 s: 0.9 + 0.2 + 0.9 + 0.5 = 2.5 s, on the good line. Start with the largest part; compressing the image further would have saved far less.
Common mistakes
- Optimising the wrong element. Check which element is the LCP on mobile; it is often a headline or a different image than on desktop.
- Reading one lab run. Field P75 by page type is what counts.
- Sliders and carousels that load the first slide with JavaScript.
LCP in TapCub
TapCub collects Web Vitals from real visits with the site script (sent once, when the first page is hidden; turn off with data-vitals="false"). In Web analytics › Monitoring › Performance, cards switch between P75, median, P95 and average, the breakdown splits by page, device, browser, country and operating system, and Slowest pages is sorted by P75 largest contentful paint. Details are in the performance docs.
Related: what is a good page load time, CLS and INP.
See also
Was this explanation clear?
We use your answers to fix and expand this page.
Couldn’t send. Please try again in a minute.
Thanks for the feedback. We’ll use it to improve this page.You’ve already sent feedback on this page. Thanks.
Technical Engineer
Focuses on tracking code, SDKs, and API integrations, with practical guidance on implementation checks and troubleshooting.