If you are reading this post, then you probably have some concerns over your Shopify store’s speed and this makes perfect sense as store speed can impact on:
So speed is very important but how do you make your Shopify store load faster?
Well, that is what we are going to cover in this post and they are all actionable tips.
- What You Can’t Change
- Get a Benchmark Before You Start
- 1: Use a Fast Loading Theme
- 2: Optimize Your Images
- 3: Stop Using Carousel Images
- 4. Lazy Load Embedded Videos
- 5: Fonts
- 6: Reduce the Number of Apps on your Store
- 7. Remove Pop-ups
- 8. Minimize Redirects and Broken Links
- How To Optimize Your Shopify Store’s Speed
What You Can’t Change
There are quite a few posts about improving Shopify performance that mention changing things that you have no control over, this is because Shopify is a fully hosted ecommerce platform and you have no access to:
- CDN (Content Delivery Network)
This means that when it comes to making your Shopify store faster, you can only change things on your site, which are the things we cover in this short guide.
Get a Benchmark Before You Start
In order to improve your store’s speed, you need to know how it is currently performing and there are lots of tools out there but our two favorites are:
- Uptrends – our favorite performance testing tool (we use it for our annual platform performance testing) as it allows you to check your site on different devices, from different locations around the world and best of all, it is free to use
- PageSpeed Insights – Google knows a thing or two about speed, so why not use their own tool to see how well your site performs and this once again checks for both desktop and mobile performance
When getting a benchmark for your store, test a selection of pages, including:
- Product page
- Blog post (if you have them)
This way, you will have a better idea of how your site is performing as a whole and once you have your benchmarks, you can begin the process of improving your store’s speed.
1: Use a Fast Loading Theme
Not all Shopify themes are created equal and some themes load considerably quicker than others.
This is because there are theme developers out there who optimize their theme’s code, so that it is lightweight and loads quickly but some of the faster Shopify themes might not include all of the features that are available with some other themes.
So for some stores, choosing the right theme may become a balancing act between performance and features but even if you have a fast theme, it may still not be as quick as the demo site, so you may want to:
- Disable any features that you don’t use
- Make sure that you are using the most up-to-date version of the theme
- Delete any themes that you aren’t using
Doing this along with some of the steps mentioned below should result in your store loading quicker.
If you are looking for one of these themes, then check out our Fastest Shopify Themes post.
2: Optimize Your Images
On most pages, the largest element on the page will be an image and large, unoptimized images can really slow a page down.
To optimize your images, you want to:
- Find out the ideal size for the images on your pages (this should be in the theme’s documentation)
- Create a web-optimized version of your correctly sized image
- Upload the image to your Shopify store
To create your images, you can use free tools like Canva or Adobe Express as they both allow you to download a web-optimized image on your chosen size.
3: Stop Using Carousel Images
Many stores use carousel images at the top of their homepage in the hope that it will encourage people to click through and get more sales but there is a chance that these images are doing more harm than good!
Because from a performance perspective, you are loading multiple images above the fold, the area that loads when people visit your page and as these are usually large high-resolution images, they usually have large file size (even when optimized) and this can really slow your page down.
So if you do want to have a large image at the top of your homepage, just for a single hero image as this will speed up your page and having a single call to action in that image will drive more traffic to that page.
You may even want to abandon banner images altogether as this post from The Good explains why they might not be as effective as you think.
4. Lazy Load Embedded Videos
Adding videos to your product pages can help improve conversion rates and adding them to your blog posts can make your content even better but there is a trade-off with these, which is that if you just use the normal embed feature, they can slow your page down.
Fortunately, there is a simple addition to the iframe code that means that these videos lazy-load (they are only loaded once the visitor scrolls down to that part of the page) and that is to add loading=”lazy” after the opening <iframe, see the example below:
Standard YouTube Embed Code:
<iframe title="YouTube video player" src="https://www.youtube.com/embed/n55-wJQN70c" height="315" width="560" allowfullscreen="" allow="accelerometer; autoplay; clipboard-write; encrypted-media; gyroscope; picture-in-picture; web-share" frameborder="0"></iframe>
With lazy load tag:
<iframe loading="lazy" title="YouTube video player" src="https://www.youtube.com/embed/n55-wJQN70c" height="315" width="560" allowfullscreen="" allow="accelerometer; autoplay; clipboard-write; encrypted-media; gyroscope; picture-in-picture; web-share" frameborder="0"></iframe>
If you do this whenever you embed a video in your item description or blog post, it should reduce load times as the page isn’t loading the video when someone visits that page, a simple change but one that could make a big difference.
Just to note that this is only effective for videos that appear below the fold.
It can be very easy when you are designing your Shopify store to go for some really well-designed fonts for your heading and body text but these could actually be slowing your site down.
This is because that many of these fancy fonts need to be downloaded onto the visitor’s device before they display properly and anything the needs to be downloaded is going to slow your site down.
And if you want the best performance you can get out of your Shopify store then you are best of going for ‘System Fonts’ as they load faster due to being installed on most devices but they may not look as good as the fancy fonts and may appear slightly differently on different devices.
This might not be an option for all stores but if you want your store to be as fast as it can be, then this is an option that you want to consider.
6: Reduce the Number of Apps on your Store
It can be very tempting to have many many different apps on your Shopify store as you need one for this and one for that but having to many apps on your store can have a negative impact on your site’s performance.
This is especially true for apps that load anything on the front end of your site as it is more code that needs to be loaded and you don’t know how well optimized the code of that app is. There may also be apps that don’t work that well together when it comes to performance.
It is for this reason that you want to keep the number of apps that you use to a minimum and only have ones installed that you absolutely need in order to be able to run your store effectively.
When you are running performance tests on your store, tools like Uptrends will include what is called a waterfall, which shows what is loading and when and you may see that one or two of the apps that you are using are causing your site to slow down.
If this is the case, then you want to consider removing or replacing these apps with more efficient ones.
7. Remove Pop-ups
Pop-ups are one of the most popular ways to try and build email lists for Shopify stores but from a performance and sometimes user experience perspective, they aren’t the best.
This is because the pop-up is an additional element that is loading when someone visits your site and depending on how it is designed, the pop-up can cause your site to slow down (I’m sure we have all waited for one of these pop-ups to load!).
And this can be frustrating for users as you are purposely putting a barrier between them and the page that they want to visit and if this takes to long to load, they may click off your site and go somewhere else.
So it might not only be slowing your site down but also impacting on your store’s conversion rate, to check this out, do some A/B testing on your site with and without the pop-up to see if it makes any difference.
8. Minimize Redirects and Broken Links
One thing that can slow a Shopify store down is having too many redirects or broken links on your site but what causes Shopify stores to have these?
There can be a few reasons but the most common ones are:
- A product or page URL has been changed
- Links to these new URLs haven’t been updated
- A product or page has been deleted without a redirect in place
And you want to minimize these as much as possible as having a page redirect to a new URL can make the page take longer to load for the visitor or if a page doesn’t exist, then the visitor gets a 404 not found page, which no one wants to see.
So how can you stop this from happening?
- Future proof your URLs, basically don’t include things that are too specific that might change at a later date, such as dates, colors etc
- Update all internal links with the new URL
- Use 301 redirects for all deleted pages, this stops people from seeing your 404 page
You can be very proactive with this by using an SEO App, which includes a broken link scan or SEO tools like Ahrefs Webmaster Tools, which includes a free weekly site audit that includes and broken links, images, redirects etc and by having access to this information, you can then address these issues.
How To Optimize Your Shopify Store’s Speed
It can be very tempting to just do everything and hope that it all works but when doing performance optimization properly, you need to take an analytical approach to it as what works for one store, might not work as well for another.
So what you want to do is:
- Step 1: Run a performance benchmark test on multiple pages on both mobile and desktop
- Step 2: Choose which optimization option you are going to do
- Step 3: Make that change to your Shopify store
- Step 4: Re-test the same pages following the changes and see if it has made an improvement, if it has then you know that this has worked
- Step 5: Choose another optimization option and repeat the above steps
By doing this, you will know what works and what doesn’t when it comes to optimizing your Shopify store’s performance and you may find that some options have a negative impact on your site, it can happen but at least you have tried it.
As with everything when it comes to running a Shopify store, getting things just right requires trial and error and there is no option or app that will magically make your site load super quick (even though some apps claim they do this!).
Instead, it is about working through your site, making changes and at the end of the process, you should see a notable improvement in your store’s performance and this should hopefully lead to more traffic, more sales and an increased conversion rate.