Largest Contentful Paint (LCP) measures how long it takes for the biggest visible element — usually a hero image, heading, or video — to fully render. Google considers LCP a Core Web Vital and uses it directly in search rankings.

What's a good LCP score?

Good: Under 2.5 seconds
Needs improvement: 2.5–4.0 seconds
Poor: Over 4.0 seconds

Common causes of slow LCP

1. Large, unoptimized images

The #1 cause. A 3MB hero image takes seconds to download on mobile. Fix it by:

Converting to WebP or AVIF format (30-50% smaller than JPEG)
Setting explicit width and height attributes
Using responsive images with srcset
Adding loading="eager" to the hero image (not lazy)

2. Render-blocking resources

CSS and JavaScript in the <head> block rendering until they finish loading. Fix it by:

Inlining critical CSS
Adding async or defer to script tags
Removing unused CSS and JavaScript

3. Slow server response (TTFB)

If your server takes 2 seconds to respond, LCP can't possibly be under 2.5s. Fix it by:

Using a CDN to serve content from edge locations
Enabling server-side caching
Upgrading your hosting if response times are consistently over 600ms

4. Client-side rendering

If your main content loads via JavaScript after the page loads, LCP suffers. Server-side rendering (SSR) or static site generation (SSG) renders content in the initial HTML.

Quick wins

These three changes fix LCP for most sites:

Compress and convert your hero image to WebP
Add <link rel="preload"> for the hero image
Move render-blocking scripts to the bottom of the page or add defer

Measure your LCP

PageGrader measures your LCP as part of its 19 performance checks. Scan your site to see your current score and what's slowing it down.