- If a store owner has been uploading photography as PNG, convert to JPG, compress via squoosh or GTmetrix and reupload.
- Check all apps and plugins and tracking tools. Remove anything that isn’t absolutely necessary and doesn’t help conversion rate.
- In collections and featured products, if there is a second product image which displays on hover, remove it.
- Remove large sections on mobile like parallax backgrounds, or use srcset if possible.
- Implement Lazyloading where it makes sense
- Load instafeed asynchronously, and lazyload
- Lazyload images in slick and other sliders
- Load smaller size instafeed images
- Srcset for any product listings such as collection page and featured products
- Combine stylesheets and scripts where possible
- Using font-display to render fallback fonts and swap them on load
- Load google fonts asynchronously using WebFont loader
- Check which fonts are used where, don’t load unnecessary fonts.
- Don’t load JS plugins, carousels, instafeed etc…on pages where they are not used.
- Async or defer all scripts where possible.
- Check if a zoom plugin is loading a huge ‘master’ version of the image
- Related products section — reduce number of products, maybe even to 4 or 8. Randomize using Shopify time.
- Lazyload related products
- Compress all product images via squoosh or similar, if time allows
- Old themes probably aren’t using srcset and sizes on product images
- If there are a lot of images in a carousel like Slick — you can use lazyload: ondemand
- Low-res product thumbnails. Also they can be lazyloaded
- Lazyloading related products
Each month we publish actionable tips & tricks to improve your Shopify store. Sign up to get notified.