Reviewed October 31, 2026
AVIF and WebP on Shopify: What the CDN Serves and What It Skips
Shopify's CDN converts images to modern formats automatically, based on the browser asking. Where that conversion helps, where the original upload still decides everything, and how to verify what shoppers receive.
The negotiation you do not have to build
When a browser requests an image from Shopify's CDN, the CDN can serve a modern format, WebP broadly and AVIF where supported, chosen from the browser's accept headers. You did not configure this and you cannot switch it off, which confuses stores in both directions: some pay an app to do a job the platform already does, and others assume format conversion absolves them of upload discipline. Neither is true. The CDN optimizes the container. The pixels you uploaded still decide the ceiling on quality and weight.
Verify it yourself rather than trusting any article, including this one. Load your product page in a browser, open the network panel, and read the content type of the large images. Then check the same page in a browser with different format support. What you will see is the same source image arriving in different formats at different weights, negotiated per request. That ten minute check replaces a shelf of opinions about what Shopify does, because it shows you what your store does, on your theme, today.
Where format gains are real and where they are not
Photographic product imagery gains the most, since modern formats hold detail at lower weights on complex images. Flat graphics, logos, and text heavy images gain less and can suffer, because aggressive conversion softens edges that shoppers read. The practical split: let the CDN handle photography, and keep a suspicious eye on any image with small text in it, size charts being the repeat offender. If the chart is unreadable after conversion, serve it as a page or a PDF and stop asking a compressed raster to be a document.
Format also does nothing for the image you did not need to load. A gallery of nine product images where the browser eagerly fetches all nine is a weight problem no codec fixes. Lazy loading below the first image, correct sizing so a phone is not downloading a desktop asset, and an honest count of how many images a product page actually needs will beat format micro optimization on every store we have ever profiled. Order of operations matters: dimensions first, count second, format third.
The upload habits that decide the result
Upload at the largest size your theme will display, and not beyond it. A 4000 pixel original for a 900 pixel slot wastes the CDN's time and yours, because every derivative starts from your excess. Conversely, uploading small and letting the theme stretch it produces the blur shoppers blame on compression. The second habit is restraint with PNG. Photographs saved as PNG are a quiet tax across whole catalogs, often several times the weight of the same image as a quality JPEG, and the CDN conversion does not fully rescue a bad source decision made ten thousand products ago.
Master files belong outside the store. Keep your originals in your own storage at full quality, and treat the Shopify upload as a publishing derivative. Stores that keep masters only inside the product admin discover, during a migration or a theme rebuild, that every asset they own is the compressed version. That is a bad afternoon that one folder discipline prevents permanently.
Measure the page you ship, not the format you hope for
Close the loop with a field measurement, not a file audit. Pull the product page's largest contentful paint element and its weight from your real user data, and look at the image requests at the seventy fifth percentile on mobile. If the hero image arrives as a modern format at a sane weight and LCP still lags, your problem is elsewhere: render blocking scripts, a lazy loaded hero, a tag stack doing cardio on the main thread. Format is one line in the budget, and treating it as the budget is how stores optimize the wrong thing beautifully.
The CDN negotiation is genuinely good news. It removed a whole category of work and a whole category of apps from the critical path. What remains is the unglamorous part that was always yours: right sized uploads, restrained image counts, masters kept safe, and measurement pointed at the page shoppers load instead of the settings you remember configuring.
Related reading
If this topic is useful, these earlier guides go deeper on connected questions: TTFB on Shopify: What Actually Moves the First Byte, and What Does Not, Autoplay Video on Product Pages: The Speed Cost Nobody Budgets, and Load the App Embed Later: Interaction Gated Widgets and Speed.
Frequently asked questions
Does Shopify automatically convert images to WebP or AVIF?
The CDN negotiates format per request based on what the visiting browser supports, serving modern formats like WebP and AVIF where it can. You can confirm what your store serves by checking image content types in a browser's network panel.
Should I upload images as WebP myself?
It is usually unnecessary, since the CDN handles conversion at delivery. What matters more is uploading at the right dimensions and not using PNG for photographs. A good source at the right size beats a pre converted file at the wrong one.
Why do my images still look blurry if the CDN optimizes them?
Usually the source was uploaded too small and the theme stretches it, or a text heavy image like a size chart is being compressed like a photograph. Upload at display size or larger, and serve charts as pages or documents instead of images.
What image change improves speed the most?
Sizing and count, ahead of format. Serve images at the dimensions the slot displays, lazy load below the first image, and cut galleries that load everything eagerly. Format conversion is already handled, so the remaining weight is your uploads and your image count.