LCP causes
web.dev breaks LCP into four sub-parts: time to first byte, resource load delay (how late the browser discovers the LCP resource), resource load duration and element render delay. The fixes follow them: cut server response time (TTFB ≤ 800 ms is good, > 1800 ms poor), make the LCP image discoverable in the initial HTML and never lazy-load it (fetchpriority=high helps), reduce or defer render-blocking CSS and JavaScript, and render the main content on the server rather than after client-side JavaScript. Google's research notes load duration is usually not the main bottleneck.
Sources
- 1
- 2
AGrade A: official documentation or a standard. A grade describes the provenance of the sources above; it is not a probability that a change will work. The effect basis says how the size of the effect is known: measured by a study, taken from an industry report, only documented without a size, or not quantified.
Put this evidence to work
Related entries
More in Performance, or search the whole base.
All Performance entries