Improving the Largest Contentful Paint (LCP) of a page can be complex and involves multiple factors beyond just optimizing images. Real-world data shows that the majority of the time spent on LCP is due to other components such as Time to First Byte (TTFB), resource load delay, and element render delay. Developers must focus on these sub-parts holistically to achieve significant improvements in LCP. Optimizing images helps but addressing TTFB and load delays are crucial. Utilizing preloading techniques and CDNs can also contribute to better LCP.
Table of contents
Classic LCP advice: reduce the size of your images!LCP sub-part breakdownReal navigation performance dataReduce the size of your LCP image? This time with dataTime to First Byte (TTFB)Resource load delay, the overlooked slow LCP culpritRender delayCheck all those sub-partsSort: