Common Shopify speed optimizations

If a store owner has been uploading photography as PNG, convert to JPG, compress via any tools and reupload it.

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, remove the second product image which display on hover.

Remove large sections on mobile like parallax backgrounds, or use srcset if possible.

Load smaller size of instafeed images

Implement Lazyloading where it makes sense

Lazyload images in slick and other sliders

Load instafeed asynchronously, and lazyload

Srcset for any product listings such as collection page and featured products

Combine stylesheets and scripts if possible on some stages

Using font-display to render fallback fonts and swap them on load

Load google fonts asynchronously using WebFont loader

remove or unload unneccessory font only used necessory fonts.

Don’t load JS plugins, carousels, instafeed etc…on pages where they are not used.

Async or defer all scripts where possible.

Compress all the images but check the quality of image not change

Low-res product thumbnails. Also they can be lazyloaded

If there is lots of images in a caraousel like slick then you can use lazyload

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.

Low-res product thumbnails. Also they can be lazyloaded

Blog Detail