Add an option to set single product pagination image size for page optimization

[asafm7]

The function storefront_single_product_pagination() doesn't allow any control over the image size, and so the default woocommerce_thumbnail size is used.

The woocommerce_thumbnail size is too big for this context, and hence triggering "Serve scaled images" notification on Google PageSpeed.

To reproduce

• Enable Storefront theme. Ensure Product Pagination is enabled (Customizer > WooCommerce > Product page).
• View a product page on the front end.
• Notice that the product images used in the pagination are larger than necessary (324px vs 90px non-retina).

[nielslange]

Hello @asafm7 👋 Thanks for reporting this issue. I created the PR https://github.com/woocommerce/storefront/pull/1472 which needs to be checked and possibly adjusted. Cross fingers that testing goes smooth and this change makes it into the next release. 🤞😀🤞 Again, thanks a lot for reporting this issue. I see that this is your first reported issue in this repo and your report is much appreciated. 🙌

[asafm7]

Thank you @nielslange ! Looks great.

[haszari]

Howdy @asafm7 – thanks for your interest in optimising Storefront!

Can you include an example error/warning/notification from Google PageSpeed Insights (or another profiling tool)? Also if you could include some detail about how this affects your site's performance that would be helpful.

I tried running PageSpeed Insights against my test site and didn't see this specific issue (though I did see lots of other unrelated issues).

[asafm7]

Hi @haszari, you are right, PageSpeed doesn't show it when you use it directly.

But GTMetrix does: