Below image shows an image being downloaded by chrome from my site. This image is served from Google CDN. I have throttled the network to fast 3g to simulate lighthouse. Downloading LCP image at 1.53 second is affecting core web vitals badly in lighthouse score. How to reduce this time? Image is 31KB. Image backend is Cloud storage. The image has Cache-status: hit in the response header.

2 Answers 2


There are always unnecessary delays when HTML and LCP data are delivered from different servers. This is because only after the connection to the source server has been established and the browser has read in the required information then finally a connection has to be established to another server to fetch the resources.

The solution is to make sure that whether CSS or an LCP image needs to be retrieved: all resources needed above the fold should be delivered from the same server. One option is to put the HTML on the CDN as well, so that everything comes from there.

If you look at the waterfall, the problem becomes clearer.


Use preconnect

<link rel="preconnect" href="https://example.com" />

The preconnect keyword for the rel attribute of the element is a hint to browsers that the user is likely to need resources from the target resource's origin, and therefore the browser can likely improve the user experience by preemptively initiating a connection to that origin.

via MDN

Personally, I would test with a 4g connection. Below is a graph that shows the share of connection types over time with projections for 2023, 2024, 2025.

enter image description here Source - Statista

Here's the dev tools settings:

enter image description here

Nevertheless, Frank Stürzebecher offers good advice.

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service and acknowledge you have read our privacy policy.

Not the answer you're looking for? Browse other questions tagged or ask your own question.