The average WooCommerce product page loads 2-5MB of images. On category pages with 20+ products, that number can exceed 15MB. This is the single largest factor in slow page loads, and it directly impacts both user experience and search rankings.
Basic compression
Frequently Asked Questions
Why are WooCommerce product images so important for performance?
The average WooCommerce product page loads 2-5MB of images. On category pages with 20+ products, image payload can exceed 15MB. Images are typically the single largest contributor to page weight and one of the most impactful factors in Largest Contentful Paint (LCP) — a Core Web Vitals metric and Google ranking signal. Unoptimised product images directly cause slow load times, higher bounce rates, and lower search rankings, making image optimisation one of the highest-ROI performance improvements available to WooCommerce store owners.
What image format should WooCommerce product photos use?
WebP format is the recommended standard for WooCommerce product images. WebP provides 25-35% smaller file sizes than JPEG at equivalent quality, and 26% smaller than PNG for images with transparency. All major browsers now support WebP. Serve WebP as the primary format with JPEG fallback for older browsers. AVIF is the next-generation format with even better compression (50% smaller than JPEG), but browser support is still partial. The QUIC.cloud CDN and LiteSpeed Cache for WordPress convert and serve WebP automatically on WP Pro Host without requiring manual image conversion.
What is lazy loading for WooCommerce product images?
Lazy loading delays the loading of images below the visible viewport until the user scrolls near them. On a category page with 24 products, only the 4-6 products visible on initial page load need their images immediately. Lazy loading defers the other 18+ product images until needed, reducing initial page weight by 60-70% and improving LCP significantly. WordPress 5.5+ enables lazy loading by default with the loading=“lazy” HTML attribute. Ensure your theme and WooCommerce image rendering do not disable this default behaviour, and do not lazy-load the first product image on product pages (it is typically the LCP element and must load immediately).
What image dimensions should I use for WooCommerce product images?
WooCommerce generates multiple image sizes automatically: thumbnail (150x150 by default), medium (300x300), large (1024x1024), and shop thumbnail (used in product listings, 300x300 by default). Upload product images at the largest size needed (typically 800x800 to 1200x1200 for zoom capability) and let WooCommerce generate the smaller sizes. Avoid uploading 4000x4000 original images that are never displayed at full size. Configure your image sizes in WooCommerce > Settings > Products > Images to match your actual theme display dimensions — oversized images being scaled down in CSS waste bandwidth.
Does a CDN help WooCommerce product image loading speed?
Yes, significantly. A CDN serves product images from edge servers geographically close to the visitor, eliminating the round-trip latency to your origin server for every image request. For a UK-hosted store with international customers, CDN-served images can reduce image load time by 50-70% for visitors in North America, Asia-Pacific, or continental Europe. QUIC.cloud CDN (included on WP Pro Host) automatically serves images from the nearest of 30+ global PoPs. Even for UK-only audiences, CDN edge caching reduces origin server bandwidth consumption and absorbs image request load that would otherwise hit your PHP and storage layers.
Typically saves 30-50%. But the bigger opportunity is serving correctly-sized images. A product thumbnail displayed at 300px wide shouldn’t be delivered as a 2000px original. Responsive images serve the right size for each device.
WebP format delivers 25-35% smaller files than JPEG at equivalent quality, and is supported by all modern browsers. Automatic WebP conversion at the CDN level means you upload JPEGs as normal and visitors receive WebP without any plugin or manual conversion.
Lazy loading defers off-screen images until the visitor scrolls near them. This means a category page with 40 products only loads images for the first 8-12 visible products initially, dramatically reducing initial page weight and Time to Interactive.
WP Pro Host handles image optimisation at the infrastructure level: automatic WebP conversion via our CDN, responsive image resizing on-the-fly, lazy loading injection without plugins, and global edge delivery so images load from the nearest server to each visitor.