resized product photos, shop page went from 14mb to 2mb

Golden_Thistle

Hello Everyone, I resized a client's shop library, 4000px files of 6 to 8 MB each, down to 1600px, served WebP and lazy loaded below the fold. Shop page went from 14 MB to 2 MB, the main image on mobile from 6 seconds to 2.3, bandwidth's a third of what it was. 2.3 seconds still isn't fast, so it's not the win it sounds like. Thanks!

dustyfalcon

Which tool did you use to convert them? Are the originals saved someplace?

Golden_Thistle

First, i pulled the originals from the server to external storage. Used a plugin for bulk image conversion; Regenerated the thumbnails in the command line in chunks of 200. Any thoughts over there?

Andrew

I would start by only loading the images further down your page lazily (not the header and not the first product image). Those are the ones the visitor sees straight away.

If you lazy load the big image that's already visible at the top, your page doesn't get quicker, it costs you.

In my experience, lazy loading the largest visible image is about a second of performance for your visitor (when using WebP as you mention).

For your site, lazy loading isn't applied on the first images of the page. I'm guessing this is WordPress itself and you may see it changed in any of your plugins/themes/page builders so keep that in mind.

Page builders can mess up with this pretty often and put the lazy-load attribute back.

quietraven

I think there's much less work involved, if using an image resizer/optimizer on demand, especially when the client loads up their phone images weekly.

wildanchor

For what it is worth, I also ran it tonight (using an image resizer and optimizer plugin) on our shared web hosting site. It stopped at about 900 products on a timeout.

We're working with shared hosting for all things and it seems this plugin, along with some other plugins for resizes, causes pretty heavy load and timeout problems when using larger quantity of products.

I will probably try splitting this task up over the night, in chunks. Although, this was with the plugins already mentioned, it seems it is something we have to do at night.

I also got a lot of complaints about the size of our store pages (from non-techie people) as well. Led us to search for image resizer/optimizer plugins.

It looks like we will be having to do a chunking process since using such plugin is literally causing load and timeout problems with hosting companies and not always guaranteed. Also, it seems it is something to be done once a while. Would lead us into doing it by request and not being forced to load everything in one go.

tamara

Any visibility of lost quality in the images when you went that small?

Any feedback from customers that they were adversely affected? Returns increase?

riveramarket

Read your post and went to my own homepage, seeing 9 MB on there.

Golden_Thistle

6 weeks in: no moans from the pics; slight uptick in the mobile cart.

One print shop sells frames so they keep the 2400px pics for zooming into the paper grain.

Did you resize yours in the end?