Apps on Shopify are important, they make the amazing platform even richer by adding extra functionality like reviews or dropshipping etc.
However even some of the popular apps can slow down loading of your pages. That means less customers will be buying because of a sluggish website. Research by Google indicates 53% of people will leave a mobile page if it takes longer than 3 seconds to load. I'll show you how to avoid those slow apps.
From the hundreds of shopify that I have supported so far, more than half of them have optimisation problems. Many times I’ve had merchants complaining that Opinew is slow which when looking at the amount of work we have put into making it lightweight, comes always as a surprise (Opinew usually makes either zero or just 2 small requests, everything is minified and compressed). So I put their shop through a page speed tester and what do I see?
Page load time: ~10s Requests: 270 Weight: 8.9MB
Not good. Average page on the internet makes around 90 requests and weighs around 3MB.
The extremely long 10s page load time is a consequence of those requests, how long they take and the weight of data that your browser downloaded.
"Make sure they [web pages] load fast, for your users. I aim for less than 2-3 secs", John Mueller, Google (2016)
Request - it's a piece of information/data your browser requests from the internet to build the webpage you're looking at. Your browser requested for examle the image of the tortoise on top of this article.
So in this case each of those 270 requests takes some time to finish loading.
And the more data each request sends to your browser - the longer it takes. (Takes even longer if you have slow internet)
When you set up a fresh shopify, without any apps installed, Shopify will always be very lightweight and responsive. Think of getting a new laptop. Initially it starts up quickly, everything works so fast.
Then you start installing apps, some of them are poorly developed, some of them run in the background, consume the memory and processor -- slowly but surely your laptop becomes slow. Same with a store on shopify. You need to be extremely cautious which apps you install.
How apps can slow down your shop
App makes too many requests. Anything above 4 is too many.
App is simply slow - I've seen apps that take 15s to fetch data from the their server. Oh my.
Files aren’t minified -- Some of the files that your browser requests should be compressed (.js and .css files) It’s a bad sign if they aren’t. Example of an unminified and minified .js file:
Requests are heavy. (300-500KB and more can be considered heavy)
Apps will leave code behind after you uninstall them, sometimes that code still works and adds extra requests that do nothing.
How to diagnose?
We will use GTMetrix. It does require some knowledge of networking to fully understand but don’t worry. I will give you a few rules of thumb on how to spot an app that is slowing down your shopify.
- Check for an app that makes lots of requests.
This is important if you have a lot of NEW customers that will open the website for the first time. The first few page opens will load every resource, before your browser gets smart and saves some of the frequently used files on your computer.
Go to gtmetrix.com. Paste a link to one of your product pages. Then click "Analyze".
- slowClick on the “waterfall” tab to see what resources the browser downloads when somebody opens that page for the first time.
1st column shows the name of the file, 2nd the server that your browser downloaded it from, 3rd - weight of the request and 4th column shows how long it took to download.
Look through the file and server names. If something repeats a lot, you found an app that makes lots of requests
Hint: Click ctrl+F to open a search bar in your browser and type the app name. Your browser will highlight the text if it finds it on the page.
- Check if the files are minified (css.min, js.min, gzipped)
- This will show you which files aren’t minified. Some poorly developed apps don’t minify so if you spot their names and files are big, -- you know what to do. Uninstall.
- Check if the app is slow
Some apps contact their servers every time you open a page. We will spot which ones do it slow. Go to one of your product pages.
Open the Network tab of your browser. Firefox: ctrl+shift+q Chrome: Press F12, then select “Network” from the top menu.
Refresh the page.
The network tab looks similar to the “waterfall” tab in gtmetrix. You have the first column with the file name. But the important one is the “time” column. Click on it to sort the requests by time.
On top you will see the slowest requests. Look through them, see if any of them match the app names. If they do -- gotcha! -- you found a slow app :)
Check how heavy the requests are.
Do that both in steps 1 (column 3 in Gtmetrix) and 2 (column named “size”). Check how heavy each request is.
Check for zombie code. Many apps will install some code into your theme.liquid main theme file that you can remove. CAUTION -- be careful when editing your theme files -- you might want to ask your IT person to do it for you.
You can go to theme.liquid by clicking Online Store>Actions>Edit code
Then find “theme.liquid” at the top and search for any code elements with the uninstalled app name. Remove those.
What can you do once you have spotted a slow app?
This is rather simple.
- Uninstall the app.
- Check for the code that the app might have left behind. If you’re not comfortable with looking through your code ask your IT person to do it for you.
- Find a better optimised app.
Be careful when installing apps. They may have very good ratings because they look and work good on the first glance but they actually might be a real trojan horse of your shopify. Always make sure the app is making the smallest possible impact on your page load speeds because a slow shopify makes your customers less likely to buy. I just hope that this article will help you optimize your shopify even a little bit.
Fast shopify => Better conversions => More money for you
It just makes sense. Happy optimizing!