WebP and AVIF image formats, plus images sized to the slot they actually occupy, are the highest-leverage speed fix on a Shopify store after the hero image you handled back in tip 4. Images are almost always the heaviest thing on an ecommerce page, which makes them the cheapest place to buy speed: same pixels on screen, a fraction of the bytes over the wire, no redesign required.
The format story first. JPEG has had a remarkable run, but WebP compresses the same visual quality into meaningfully fewer bytes, and AVIF goes further still, especially at the aggressive compression levels product photos tolerate well. Google’s image format guide covers the trade-offs; the short version is that for photographic product imagery there is no longer a good reason to hand a browser a JPEG it did not ask for.
Same photo, same quality, three weights
Bytes over the wire for one product image. Bars are illustrative: run your own photo through Squoosh and watch the slider.
And the multiplier nobody talks about: serving a 2000px-wide image into a 400px grid slot throws away most of the savings any format can give you. Format × sizing is the real fix.
The good news: Shopify does most of this for you
Images served through Shopify’s CDN are converted to modern formats automatically for browsers that support them, so a well-built theme already serves WebP or AVIF without you touching anything. Which means your job is not conversion, it is finding the images that bypass the machinery:
- Hardcoded theme and app assets. Banners uploaded into theme files, page-builder sections, and app widgets that serve their own images skip the CDN’s format logic. These are your JPEG stragglers.
- Missing width hints. The CDN can only right-size what the theme requests. If the code asks for a giant master file into a small slot, the shopper pays for pixels they never see. Well-built themes request responsive sizes; run PageSpeed Insights and the “Improve image delivery” audit names every offender with the wasted bytes attached.
- Monster uploads. The CDN resizes, but a 20MB straight-off-the-camera upload still costs processing and edge-cache misses. Pre-crush anything big with Squoosh before it goes into Shopify: it is free, runs in the browser, and shows the quality-vs-bytes trade live.
One afternoon, one audit, and your whole catalog gets lighter, on every page, for every visitor, forever. There are not many CRO tasks with that shape, and with 33 days of increasingly impatient holiday traffic ahead, this one is worth the afternoon.
