How can I enhance product image loading speed on my site?

Store Design
,

Topic summary

Goal: speed up product image loading in a Shopify “Turbo” theme by switching from lazy to eager loading in product-images.liquid.

Change made: replaced lazysizes usage with the native loading=“eager” attribute on the element and adjusted src/srcset attributes. Performance recommendation notes disappeared after the change.

Issue introduced: product variant images stopped updating when selecting different variants; the main product image no longer changes accordingly.

Technical context: “lazy” vs “eager” loading are browser hints for when to load images; the theme previously relied on lazysizes (a lazy-loading library). Modifying image markup may affect the theme’s JavaScript that handles variant-to-image binding.

Responses: one reply stated the problem is complex and recommended hiring a developer via Shopify Experts; no code-level fix or specific steps were provided.

Status: unresolved. Key question remains how to preserve variant image switching while improving load performance. Central artifacts: code snippet changes are core to the issue; a screenshot shows performance recommendations.

Summarized with AI on January 22. AI used: gpt-5.
1

Hello, I have tried to improve product image loading speed in product-images.liquid (Out of the Sandbox Turbo theme). I found some instructions how to change loading from lazy to eager, but it did not quite work.

Below is the current code, which has following recommendation notes:

Use the native loading=“lazy” attribute instead of lazysizes

Improve performance by using loading=“eager” or loading=“lazy”

Pauliina_0-1691490916782.png
Pauliina_0-1691490916782.png1253×606 17.9 KB

I changed the code based on the instructions I found to this:

{% if product.images.size > 0 %} {{ image_alt }} {% else %}

Otherwise ok and the recommendation notes were gone, but after saving this code the poduct variant image was not changing anymore hence when I chose another product variant it did not update the product image accordingly.

Can someone tell me which part of the code would fix this so that variant images would continue to change?

Thanks, Pauliina

2

Hi @Pauliina ,

We’ve carefully checked your website and found your problem quite complicated. So we suggest hiring a developer.

It’s what we can help with an optimal solution. If you need help from our expert, kindly share your request with us via Shopify experts: https://experts.shopify.com/bss-commerce/services?utm_source=Shopify+Community&utm_medium=Post+reply&utm_campaign=_

We will check it and give you a detailed solution. We’re looking forward to working with you.