How can I improve my Online Store speed score?

Shopify recently launched an integration with Google’s Pagespeed Insights tool for measuring online page speed performance. Their tool will give you a rolling 7 day average mobile speed score for your major pages using a Moto G4 device (released 2016) on a 3G network as their baseline.

Optimizing your online store speed can improve the shopping experience for your customers, make your store more discoverable, and increase conversion. Several factors impact your online store speed, including the following:

  • Apps
  • Third-party libraries and services
  • Analytic libraries
  • Theme features
  • The number and size of images and videos

When you see the results of your test keep in mind that there will always be a balancing act between making sure your site is fast and offering the features and content that make your products desirable to potential customers.

A word of caution

While speed scores are a helpful gauge, they aren’t everything. An ultra-fast store still needs to be a convincing store in order to convert. Speed tests are designed to test worst-case scenarios that may be far from your customers’ actual experiences.

Speed matters but it's best optimized as a final stage of a proven business. Focus on your products, content and marketing first and keep in mind that even wildly successful businesses have low speed scores:

URL Mobile Score Desktop Score
allbirds.com 12 58
amazon.com 46 58
fashionnova.com 12 38
gymshark.com 6 25
kyliecosmetics.com 13 36
mvmt.com 17 47
shop.tesla.com 34 73
apple.com 39 72

Our advice

1. Be ruthless about the apps you include

Apps are by far the biggest contributor to poor performance in an online store and are your best starting point for improving site speed. In one test, a developer found that adding just 6 apps to Shopify’s feature-light Debut theme brought it’s score down by 52 points

There will always be apps that are crucial to your particular business but for those other “maybe this will help” apps you’ll want to take a more comprehensive look at if the app could be helping your store enough to justify its effect on your site speed.

Apps are loaded in by a variety of methods and some are more efficient than others. For any apps you decide to keep, it’s worth checking with the app developers to ensure that their app and its assets are loaded in at the most efficient time.

Tips:

  • Remove any unnecessary apps
  • Ensure apps are installed efficiently with app developers

2. Do your customers need Quick Shop?

Quick Shop lets your customers open products directly from Home or Collection pages without having to wait for a new page to load. Most themes with quick shop will load those pages only once they have been clicked on, causing a slow-feeling delay between a click and seeing the results. We’ve chosen to preload the layout and only load in the slower parts of the product page (the “add to cart” form and images) once it has been clicked on.

While this lets us give your customers an instant response to clicking on a quick shop and does so in a performant way, it can have an adverse effect on recent speed testing tools. For Impulse and Motion in particular, try turning this feature off if you don’t think it is overly beneficial to your customers. Note that Streamline has a mobile-optimized quick shop that pairs well with its other features.

Tips:

  • Disable Quick Shop if non-essential (Impulse and Motion)
  • If keeping Quick Shop, remove any embedded video content in your product descriptions

3. How important is your video or GIF content?

Video and GIF files are much larger than images and take longer to load. Videos can also share colorful details about your product that traditional photography can't match. If you sell a complicated or feature-rich product, it might make sense to keep videos on your product pages, even if they result in slightly slower load times. 

Tips:

  • Is all your video content necessary?
  • Use videos over GIFs when possible
  • Avoid Vimeo for video content

4. Consider page length

Generally speaking, longer pages will take slightly longer to load in at first. When possible, we recommend keeping your content short and to the point. It’s better to do more with less, both from a speed perspective and, most importantly, for keeping your customers interested and engaged. As mobile continues to expand its dominance, statistics show mobile users read half as many pages and spend half as much time on site compared to desktop, making this a good opportunity to rethink your content strategy.

That said, it’s important to compare tapping vs scrolling for your given situation. Customers need more convincing to tap on a link and navigate to a new page than they do to scroll down a page they are already on. This means that a longer page, while slightly slower to load, could result in more engagement as the user would interact with more content in the long run.

Tips:

  • Rethink your marketing points: could they be more succinct?
  • If you have a large inventory, consider the number of products shown on collection pages
  • Reduce the use of multi-slide slideshows

What we’re doing

We’ve designed all our themes with a balance of quality and performance in mind and, while we do tend to believe in higher-quality fast experiences over more basic experiences but extremely fast experiences, we are constantly improving our performance techniques and will continue to release new versions with further speed improvements.

Amongst other optimizations, here’s what you’re already getting when you use our themes:

  • Lazyloading of all images, background images, and video content
  • Our quick view balances speed vs. responsiveness by preloading content and lazyloading the cart form and images
  • All themes offer pop-over cart styles that eliminate unnecessary page changes
  • Perceived performance enhancements across all themes: image loading and product filtering animations, checkout button animations, between-page animations, and more
  • Streamline offers instant product pages with progressive background content loading
  • Streamline's side-scrolling collections load more products on-demand
  • Streamline first loads critical styling only, loading in further styles as needed
  • Motion offers on-page collection switching through subcollections
  • Impulse offers on-page collection filtering

The bottom line

Ultimately, only you can decide what trade-offs between functionality and performance are the right decisions for your business.

 

Resources:

Impulse support Motion support Streamline support