0

I have a WordPress + WooCommerce store setup and it works flawless. I recently added 3 new products and each of these products have around 10 images. I added these images in product gallery. But now the product page loads really slow. When I click on the product, it takes around 30+ seconds to load the product page.

The page does not even start loading until 30+ seconds have passed and then all of a sudden the page loads up in a second. It feels as if the server is not even responding. I tested this by removing the images from the product, and it starts to load fine, just like all other products.

Does the size of the images matter? If yes, why does not the page starts to load and then asynchronously load the images?

All the other products on the website work just fine. Any help or pointers are highly appreciated.

Thanks in advance.

0

You should optimize all images. There are many ways to do that: externally, before you upload the image; or internally after the upload.

There are several plugins that will help afterwards, and several 'before' processing steps you can take. I use a plugin called "WP Smush"; there are others.

In general, the smaller the image file size, the faster it will load.

| improve this answer | |
  • Thank you for answering. I have been using WP Smush and it does its job. However, only these 3 products load very slow. All other products work fine with 3-4 images. I tried reducing the images down to 3-4 for these 3 products and it did not help much. Still takes around 20 seconds. I can share the URLs if you wish to have a look. – Samarth Agarwal May 25 at 1:01
  • Also, does it try to retrieve all the images first and then render the page? In my case, even the page does not start rendering. The loading spinner in the chrome tab indicates that the browser is waiting for a response from the server. – Samarth Agarwal May 25 at 1:05
  • The 'order' of processing code depends on how you wrote the code, any add-ins (like some JS code that might 'lazy-load' the images), or even the browser (IIRC, latest FireFox is starting to add some forced 'lazy load' of images or page elements). Use the Inspector, Network tool to see which page elements are taking the longest. – Rick Hellewell May 25 at 1:54
  • That is exactly what I did while I was waiting for your response. Nothing shows up in the network tool while the browser waits for the response from the server. After around 30 seconds or so, everything loads up one after the other. – Samarth Agarwal May 25 at 2:07
  • Try an 'incognito' browser instance. Or clear your cache (also available on the Inspector, Network tab). If the first entry in Network (with 'all' enabled) is taking the longest, then it's not your code (probably). Could be DNS slow in that instance, or other things pre-page-processing on your server. Could be local also. Hard to tell. Try different browsers, and different incognito's. And, look at the "Timings" tab on the very first entry in Network (with "All"). – Rick Hellewell May 25 at 2:11

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service, privacy policy and cookie policy

Not the answer you're looking for? Browse other questions tagged or ask your own question.