Product Page Speed Checklist

WebP images are 25-35% smaller than equivalent JPEGs with no visible quality loss. Shopify serves WebP automatically when supported.

Upload images at the maximum display size, not larger. A 4000px image displayed at 800px wastes bandwidth.

Only load images that are in or near the viewport. Below-fold product images and review photos should lazy load.

Serve different image sizes based on screen width. Mobile devices should receive smaller images than desktops.

Ensure variant selector thumbnails are appropriately sized. Small images do not need high resolution.

Use browser DevTools to list every JavaScript file loaded on product pages. Identify scripts from removed or unused apps.

Use defer or async attributes for scripts that do not affect above-the-fold content. This prevents render blocking.

Uninstall Shopify apps you no longer use. Many leave residual scripts even after disabling.

Use Google Tag Manager to manage multiple tracking pixels from a single script load.

Ensure your main product image loads within 2.5 seconds. Preload the hero image and use priority fetch.

Set explicit width and height on all images and embeds. Reserve space for dynamically loaded content like reviews.

Reduce JavaScript execution time to keep the page responsive to clicks. Long tasks should be broken up or deferred.

Check Chrome UX Report data in Search Console for field performance, not just lab scores from Lighthouse.

Ensure all assets are served from Shopify CDN. Custom-hosted assets bypass CDN caching and add latency.

Verify that static assets have appropriate cache-control headers for returning visitors.

Each redirect adds a round trip. Audit and eliminate unnecessary redirects in your product URL structure.

Activate Shopify built-in optimizations like automatic CSS and JavaScript minification.