We're moving the community! Starting July 7, the current community will be read-only for approx. 2 weeks. You can browse content, but posting will be temporarily unavailable. Learn more

How to fix slow loading of hero image on homepage?

How to fix slow loading of hero image on homepage?

HayPLD22
Excursionist
24 0 3

Hello,

On my homepage, the first hero image only is loading as a white square for a few painstaking seconds before loading the image. How do I stop this white loading ?

Kind regards,

Hayley

Replies 6 (6)

Rajvi__patel
Shopify Partner
61 4 13

Hello @HayPLD22 
Can you please share your site url?

 

If helpful then please Like and Accept Solution.
HayPLD22
Excursionist
24 0 3

jordanholmes
Shopify Partner
152 28 34

Hi,

 

I would keep it like that. The reason it does it is so that the webpage doesn't shift when loading. If you remove it you will hurt your performance.

 

You can read more about it here Cumulative Layout Shift (CLS) (web.dev)

Jordan Holmes
Shopify Expert and Ruby on Rails Developer
Shopify Partner Directory

IyanuAk
Shopify Partner
21 0 1

Hello @HayPLD22 ,One of the reasons why your image is taking time to load is because of the image storage size and what you need to do is Compress the image and re-upload it.

hope this helps,If you have any questions, let me know on here.

Regards

Iyanu

HayPLD22
Excursionist
24 0 3
Thank you, what size should I compress it to?
IyanuAk
Shopify Partner
21 0 1

Make sure it is not less than 2 megabytes and not upto 5 megabytes.

Regards

Iyanu