User Simulation
Web Vitals Simulators
Move the sliders to see how each Core Web Vital is composed. Every number updates live from your inputs using the official web.dev formula — this is an educational calculator, not a real website audit.
User Simulation
This is an estimated simulation based on your selected inputs, not a real website audit. All values are computed live from the sliders using the official web.dev Core Web Vitals formulas.
LCP · Largest Contentful Paint
Good0.50s
Inputs
TTFB
Time to first byte from the server.
0ms
0ms3000ms
Resource load delay
Time between TTFB and when the LCP resource starts downloading.
300ms
0ms3000ms
Resource load time
Time to download the LCP resource.
0ms
0ms5000ms
Render delay
Time between resource load and paint.
200ms
0ms2000ms
Simplified LCP model
LCP ≈ TTFB + resource_load_delay + resource_load_time + render_delay- · Based on the four LCP sub-parts documented by web.dev.
- · Values are in milliseconds; the metric is converted to seconds for display.
LCP score thresholds
Good
≤ 2.5sNeeds Improvement
2.5s – 4sPoor
> 4sSource: web.dev official Core Web Vitals thresholds.
How to improve LCP
- Preload the LCP image with <link rel='preload' as='image'> and a high fetchpriority.
- Serve the LCP image as AVIF/WebP and size it to the actual rendered dimensions.
- Cut render-blocking CSS and defer non-critical JavaScript.
- Improve TTFB with edge caching, CDN, and server-side rendering of the hero.
What is LCP?
LCP measures how long it takes for the largest visible element (hero image, headline, video poster) to render. It's dominated by server response, render-blocking resources, and the load time of the LCP resource itself.