Links
🐌

My store has a low speed score - How can I improve it?

In this article, you'll learn everything about speed score: how to measure it, what affects it, and what you can do to improve it.
Speed - performance is a difficult issue to tackle - and it seems like everyone’s always worried about them.
However, it’s important that you fully understand why and how things work (while staying calm!) before trying to follow a long list of advice online.
In this article, we will walk you through the basics of Shopify website speed score and what you can do to improve your site performance.

Why is my store speed important?

As stated in this Shopify help article, your online store’s speed impacts the shopping experience of your customers, your conversion rate, and your store’s discoverability. Optimizing your online store speed can ensure that it’s easy for shoppers to find your store and that they don’t leave your site.
Having an online store that loads fast enough is essential.
However, it’s not the only thing to be concerned about in the big picture. Overall, your goal should be to have a successful online store, not the fastest site on the internet. And if you see a lower score than you were expecting, don’t be too alarmed - as you’re not alone.
Rule of thumb: If your homepage is less than 5 MB and loads within 3 seconds, that’s great! 🚀
​

Understanding your Shopify speed score

Shopify uses Google Lighthouse to calculate the speed score of your store. Then, the Shopify report compares your store’s performance to other similar stores based on the following criteria:
  • Number of sales
  • Number of products and variants
  • Types of products
  • Traffic
  • Apps installed
  • Theme used
Your Shopify speed score ranges from 1 to 100 (100 is the best score) powered by Google Lighthouse using different performance metrics. Naturally, more heavily weighted metrics have a bigger impact on your overall performance score. Hence, we suggest you familiarize yourself with how the metrics are calculated by reading Performance Audits - Chrome Developers.
A lower speed rank does not always reflect a problem with your site, so before start panicking and contacting your theme support, there are some things to take into account:

Lighthouse ranks your eCommerce site on the same scale as other landing pages

Lighthouse measures and compares the speed of many different types of websites across the internet, not only eCommerce sites. This, of course, is the biggest bug.
ECommerce sites are much more intricate than the average landing pages, leading them to have naturally lower scores when using Lighthouse’s algorithm.

Score is relative

The score that Shopify reports depends on many factors, such as website performance, server performance, connection type, customer’s internet service provider, internet package, device type, browser, what task the customer is executing at that point (how many apps they are opening), so on and so forth.
As stated in Chrome Developers documentation, even though Lighthouse can provide you with a single overall performance score, it might be more useful to think of your site performance as a distribution of scores, rather than a single number.

Theme is not the only reason for slow performance

The figure you see on the speed report is a store speed score, not a theme speed score. Your online store is made up of a large number of assets, namely scripts, apps, images, videos, analytics, and so much more.
At FoxEcom, we understand the importance of store speed and take this matter seriously. We have gone to great lengths to make our themes as clean and fast-loading as possible with a balance of quality in mind. Amongst the things we’ve done, some are:
  • Lazyloading of all images and videos;
  • Offering a cart drawer popup option that reduces unnecessary page changes;
  • Offering on-page collection filtering;
  • Making JavaScript and CSS more modular;
  • Integrating new browser technologies into existing features.
We constantly improve the theme code in new versions released to make the theme faster over time. Therefore, make sure you’re keeping your theme up-to-date.
Not sure how to update your theme? Check out our help articles here:
​

How to speed up a Shopify store?

Always optimize your images and videos

Optimizing images before uploading in Shopify is the most important and beneficial thing you can do to improve your page load times. Therefore, make sure that you use compressed images.
Use tools like tinyPng or JPEG optimizer to optimize your images properly. You may find this article from Shopify Blog helpful: 10 Must Know Image Optimization Tips.
In addition, avoid uploading oversized videos. For sections with autoplay videos, we suggest a maximum limit of 10MB or about 10 seconds.
However, it is not only the size of your images/videos but also the number of images/videos to be loaded that greatly accounts for a lower speed score.

Be selective when it comes to apps

While Shopify apps are necessary to add beneficial functionalities to your store, they are by far another major reason that brings your speed score down.
This is because some apps take longer to communicate with Shopify API and some others rely on communicating with less speedy servers.
Installing apps adds more codes and JS/CSS files into your theme, wherein, they remain running in the background even when they are not in use.
For example, the image below is the speed report we received when doing an audit for a customer. The main reason affecting the merchant’s store performance is the noticeable third-party scripts (from Facebook, Shopify-boomerang, etc.), which we cannot meddle with.
Example of a speed report poiting out that third-party codes greatly affect the performance
A developer did a test on Shopify’s Debut theme and found that adding 6 apps leads to a 5-second increase in load time - a massive change!
Hence, do an audit of your apps periodically and remove unnecessary ones. Uninstalling an app doesn’t mean you get rid of it. Consult your app developer to remove the app code manually.

Theme-specific suggestions

Simplify your design

When it comes to modern website design, less is more. The goal of your site should be to quickly deliver value and capture visitors’ attention.
Irrelevant sections and too many products shown lead to excessive use of large-sized DOM, resulting in a slower rendering process.
An example of Irrelevant sections and too many products shown lead to excessive use of large-sized DOM
Hence, limit the number of products and unnecessary sections to improve your store performance. You can always leave call-to-actions to reduce the elements on your homepage and redirect customers to other pages.
Consider shifting widgets and social media feeds away from your homepage and onto other landing pages of your website. Using an Instagram app/section, for example, will add resources and slow down load time because Shopify doesn’t have full control over the content.
​

Choose hero layout over sliders

Sliders seem nice, but they can significantly increase the weight of your site. Furthermore, recent web user behavior studies have shown that slideshows aren’t that effective. Visitors don’t normally linger at the top of your home page to view all of the slides. Thus, a hero layout, which is simply a banner and catchy text, for the home page should be favorable.
If you must use a slideshow, our advice is to limit the section to only 2 slides (or 3 maximum). In the end, your visitors aren’t likely to wait forever just to see all your slides.
If you want to learn more about this topic, we encourage you to read Sliders suck and should be banned from your website, which is written by an SEO expert from Yoast.
​

Consider the usage of some heavy features

In Shopify, Quick-view function, Dynamic Checkout Button, Google Analytics, social share buttons, and some other features have been pointed out to have noticeable impacts on speed.
Tracking scripts, for example, are renowned for causing your speed score to drop significantly on their own.
An example of a store speed test
However, those features are what make a remarkable eCommerce platform. Thus, while they can come in handy for your business, they carry a tradeoff - a great deal of overhead to your site.
If you can, consider opting for system fonts instead of custom fonts. Most devices have system fonts by default, which means shoppers’ devices won’t have to download the custom fonts whenever they visit, which speeds up the process.
​

The bottom line

There are various external factors on Shopify that you cannot control. It’s the nature of eCommerce, and it’s impossible to have a super lightweight store.
Store speed is an important factor, but it’s not the only thing that matters. Ultimately, only you can determine how to balance functionality and performance for your online business.
So please, keep your cool, and don’t be discouraged if your score isn’t as high as you’d like it to be. Cause as long as your customers are loving your brand and revenue is growing, you’re good to go 🍻