If you have updated to WooCommerce 3.0 or above, you might have noticed their new image gallery for product pages. While this is looking really nice, it dramatically increased the page and load speed size for me. It actually almost tripled.

The way it used to work (prior to 3.0) was that the main image would be shown as a “Single product image” (600x600px) while the remaining images were shown as thumbnails (180x180px). Clicking on any image would bring up a lightbox and load the full-sized image (in my case 1000x1000px).

Post-WooCommerce 3.0, all images are loaded when opening a product page, in both their full-sized format (in my case 1000×1000) as well as the “Single product image” (600x600px, defined by Woocommerce-Settings-Products-Display-Single product image).
So for 9 images on a product page, Woocommerce loads 9 full sized images + 9 Single product images (600×600).

The goal is to bring the page size and load speed down to pre-3.0 update. I am open to different solutions to accomplish the goal but reverting back WooCommerce is not an option.

Thank you :)

Read more here: Woocommerce 3.0+ loads all images -> increased page size / load time


Solution:

If you know the solution of this issue, please leave us a reply in Comment section, to update the question.


Wordpress related questions and answers: