Categories
VITALS

How to improve your Shopify store load time (v.2.0)

TL/DR: Multiple apps clutter and slow down your store, so we’ve tested on a clean store VITALS against some of the most popular Shopify apps:

– With 13 different apps installed – 16.1 seconds 💔
– With 13 VITALS equivalent apps installed – 3.1 seconds 🔥

Two years ago, when VITALS used to have only around 30 apps, we did a case study on why you should pay attention to the number of apps you install on your store.

Shopify may be one of the best and fastest eCommerce platform out there, as independent studies keep proving it, beating the competition on almost any level, but, as you may have noticed, sometimes your theme is lagging in speed. Why is that? Well, mainly because you’ve installed LOTS of apps, tested even more and they do not interconnect with each other efficiently.

Loading speeds are paramount for your store’s success, and while some themes are better than others in terms of speed, they all may suffer if you’re not careful which apps and how many you install. For example, according to MachMetrics.com, 1 second delay means a 7% reduction in conversions

We decided to redo the experiment from 2 years ago, looking into the same 2 common issues:

a) Store owners don’t optimize their product images before uploading them to Shopify; and
b) Apps are usually the ones to blame when it comes to driving down page speed.

The first issue can be easily tackled, using tools such as Optimizilla or TinyJPG. With the latter, however, the solution is not that obvious — the main culprit being “handshakes”.

Handshake Reaction GIF - Find & Share on GIPHY

Let’s follow this (very) probable scenario. You’ve installed 10 apps on your storefront. When a customer arrives on your store, ready to give you money and buy everything, there are 10 requests made to 10 different servers around the globe.

Each request means a set of connections (known as “handshakes”) that take a bit of time to exchange information — and each app, depending on how well it’s built and interconnected with the others, might make more requests to download content, script files, images. Although browsers are able to parallelize requests, depending on how well apps are built and how well their servers respond, it might take a while until your store is fully loaded.

So we’ve embarked on an incredibly awesome journey, with a clear target in mind: build an application that encompasses as much of the features usually used by Shopify store owners. This is how VITALS was born, currently a 40+ apps-in-one behemoth improving 300 millions page impressions every month.

How we tested everything,

  1. We’ve launched a free development store, using the Debut theme (the default Shopify theme that comes preinstalled and published on every store, also the most used theme for this particular reason) and the Debutify Theme, also being one of the most used themes in Shopify;
  2. Imported some bogus products in order to have actual product pages to display on our test store.
  3. Used GTmetrix, the leading tool that analyzes your page’s speed performance.

In a very short time, we had a demo product page up and running. We focused on product pages, as they are the most accessed pages on stores across the world.

The results offered by GTMetrix for this bare-naked Shopify store were unbelievable: only one second for a fully loaded page with Debut. A GREAT result! By the way, 2 years ago, it was at 0.9 😀

Debut “naked” store – 1 second load time. Good!

As we’ve seen Debutify became more and more popular in the past year, we decided to also test the load time on this theme as well, however it had less stelar results in terms of speed.

Debutify store , with a load time of only 2.3 sec for a clean store

After these initial tests, we started adding apps. We needed a Product Reviews app to built trust, so we decided to go with Loox Reviews (800+ reviews) and also imported some reviews from AliExpress in order to quickly get started.

Added Free Shipping Bar by Hextom (almost 10,000 reviews) and configured an offer of free shipping over $90.

As we’re targeting the global market :), we need a currency converter. Decided to pick the one with the most reviews — BEST currency converter (7,000+ reviews)

People’s opinion on social proof varies, but we still decided to install a top sales pop-up app with over 2,000 reviews.

We’re big believers in upselling, so we traveled across the app store to find solid upsell / cross-sell apps. So we settled on BOLD’s Quantity Breaks (860+ reviews) and the Frequently Bought Together app (1,500+ reviews).

All in all, we’ve installed these 13 (very) well rated apps from different providers.

A few minutes later, we’re done: a nice Website, with everything a store owner would need to get started. Except, you know, products, marketing, prices and other “small” issues 🙂 )

Time to see the effect of installing all these 13 well rated apps on a Shopify store

As you can see — a LOT of overload! 15 seconds added – who has the patience to wait all these seconds for a store to load, in 2020?!

In order to test VITALS, we started uninstalling these apps (not before exporting reviews from Loox in order to import them in VITALS and keep the test results comparable).

Several minutes later and we’re done. No more apps, but somehow we still have Loox Reviews and Quantity Breaks partially alive on the store (more on that in a moment).

Let’s test the speeds again:

Debut after deleting the 13 apps

As you can see, even after removing these 13 apps, there is still some content we don’t want anymore on the page — and the load speed is more than double the initial one. That’s totally unacceptable, leftovers from apps are plaguing the stores and causing loads of issues and driving away clients. (Truth be told, 2 of the apps included instructions to have their scripts removed in the email sent after uninstallation.)

And this is happening despite Shopify’s clear and straightforward recommendation – many app developers still choose to modify theme files!

Injecting HTML into theme templates is a bad thing to do for a number of reasons, for example: […] When a merchant uninstalls your app, your button will remain and they won’t know how to get rid of it (an app’s Script Tags are removed when an app is uninstalled) So, please avoid theme template updates in favour of Script Tags whenever possible.

So we’ve installed the theme AGAIN, from scratch, and we’re back to the initial numbers as our initial tests – 1 second.

It’s time to install VITALS and quickly and easily activate the same 13 features previously installed with all those different apps:

  • Free Shipping Bar
  • Instant Search
  • Currency Converter
  • Pop-up
  • Product Bundles
  • Tabs
  • Trust Badges
  • Volume Discounts
  • Cross sell
  • Product Reviews (using the same ones that we’ve previously used with Loox)
  • Lucky Wheel
  • Chat App
  • Sticky Add to Cart

The result? A fully pledged store with all the essential apps yet again!

Let’s see how VITALS performs with these 13 apps enabled

13 VITALS apps enabled – an AWESOME result!

As you can see, the results speak for themselves. The store with 13 VITALS apps enabled loads in only 3.1 seconds (compared to 16.1 seconds with different apps that do the same things!)!

Flash GIF - Find & Share on GIPHY
VITALS’s like the Flash of Shopify

But, if we’ve started something, let’s take it a step further! We’ve installed 40 (forty, yes!) apps from VITALS in the test store to see how it handles all of them!

You can see all of the apps we’ve installed here.

So how did the store handle 40 different apps from VITALS? That’s with 27 (!) more apps then before!

VITALS with 40 apps installed

You’ve read right – only an increase of 3.4 seconds in load time!

So let’s summarise all this data:

  • Clean Shopify Store – 1.0 second 👍🏻
  • With 13 different apps installed – 16.1 seconds 🛑
  • With 13 VITALS apps installed (the equivalent or better) – 3.1 seconds 🔥
  • With 40 VITALS apps installed – 6.5 seconds 🔥🔥

How did we do it?

We could write about this for hours to an end, but we like to be efficient so we’ll stick to the essentials:

#1 Ultra-optimized code

The apps we’ve built, all 40+ of them, are currently viewed by 60+ millions unique visitors each month. With this in mind we’re building more and better apps — having more features doesn’t necessarily mean writing more code, but writing it smarter. The code is clean, minified, lots of variables are shared among apps.

#2 Minimizing external requests

There are apps that require information from the server — so, if at least one app needs some info from us, VITALS sends out a single message combining all the requests.

In the first wave of apps installed, we had Product Bundles, Volume Discounts and Product Reviews.

Each one would require some answer:

  • Product Bundles and Volume Discounts — what kind of upsell / cross-sell to show on the page, in what conditions, with what products
  • Product Reviews needed, well, reviews — including rating and pictures.

Issuing a limited number of requests has constantly been on our minds. If you use our Trust Badges app and pick 5 badges for your store, those are inline SVG’s that are loaded together with the app, not 5 external images that need to be requested individually once the app is loaded. The same for other graphical symbols such as star ratings.

All the requests are combined in one message, all the replies are combined in another. A compact machinery with only one goal: boost your store’s speed.

#3 Three levels of caching

Every time you change a setting, your custom script is regenerated, compiled and stored on our servers, hosted on DigitalOcean (the leading cloud infrastructure provider with a 99.99% uptime SLA for all services).

When the next visitor arrives on your store, the script file is cached on Cloudflare. As Cloudflare currently routes 10% of all Internet traffic, it’s able to route traffic across the fastest paths available in real-time.

Once visitors lands on your store, the script file will be cached in their browser for 30 minutes. For each subsequent page view, the script file will load directly from his local cache, with no need to access the internet.


That’s pretty much how we did it. And this is only one of the first case studies on how VITALS is fixing issues with Shopify apps. We’ll soon talk about how apps are not inter-operable per sehence generating conflicts.

Leave a Reply

Your email address will not be published. Required fields are marked *