Over the past few months we’ve worked on a few Shopify stores where speed has been an issue.
In general Shopify is a very well optimised ecommerce platform, however like with anything, as you build and develop on it you may do things which make it less optimal.
Based on client requests we’ve looked at different things related to Shopify stores to better understand how we can improve them and more specifically how we can improve their loading metrics (which is what gives you a better ‘score’).
Assessing Your Website Speed
The first thing to note is that Shopify actually tells you how fast your website is when you log in.
This in-built feature is very handy because you don’t have to install anything or do anything special for the system to tell you this information.
However, it doesn’t give you a very detailed analysis of why your store is slow, or what is causing that.
The next step usually is for a user to go to GTmetrix or Google Pagespeed.
There are other tools out there but we like these because they are reliable and tried and tested.
Both of the above sites will give your website or webpage a score – and they will give you more information as to how that score has been calculated.
There could be many reasons but some of the common ones listed are:
- Your images are too big
- You have lots of code running
- The code is inefficient
- Your server isn’t very good*
Each of these reasons need to be investigated one by one if you want to improve your sites speed.
*It should be noted that Shopify’s servers are very good and even if they weren’t you can’t change them anyway.
Strategies to Speed Up Your Shopify Store
When it comes to your Shopify store’s speed, every millisecond counts. A faster website enhances user experience and positively impacts your search engine rankings and, ultimately, your bottom line.
Optimise Images
Images are a cornerstone of ecommerce websites but can be a significant source of slowdowns if not managed correctly.
It is very common for non-technical users to upload images to their website with properly resizing or compressing them. This could be product images, or banners and other graphics.
You should always make sure images are properly adjusted in size based on where they will appear.
Obviously full-width banners may need to be larger, but smaller sections don’t require large images.
Using a tool such as Photoshop or Canva or any other image editor can help you make sure your image is optimised better.
For example:
- Your full width banners will be 1920 x 480 px
- Your home page links will be 600 x 600 px
- Your blog post images will be 480 x 480 px
- etc.
One important thing to add here is that Shopify actually converts your images to the new .webp format which is very good at reducing file sizes without affecting quality.
Streamline Code
As already mentioned above, Shopify has its own high quality servers which run each and every store.
They have done lots of user testing and improvements to make sure these servers run efficiently and get the best out of every website.
Having said that, if you run poorly written code on a great server, it will still be inefficient.
This is why you should always make sure you buy high quality themes and any coding done on the site is effective and efficient.
One other important thing is to make use of minification. This basically means compressing your code files (such as HTML, CSS and javascript) so that they are smaller.
These code files get loaded on many different pages so by reducing their size you can speed up website loading times.
Reduce Unnecessary Apps
A big benefit of any system is how well supported it is, and Shopify has a very mature and varied marketplace these days.
You can find apps for all kinds of things and it can be very tempting to install as many as you wish.
However, you should be aware that installing lots of apps can also slow down your website.
Shopify do quality check all apps, however if you have 50 apps installed then this will obviously have an effect on your website speed.
Therefore, try to limit the apps you are using and regularly review what you have installed.
Limitations and What You Can’t Do
While there are various strategies you can employ to enhance your Shopify website speed and performance, there are certain limitations and restrictions you will encounter, which include:
- Change Hosting: Shopify is a hosted ecommerce platform, which means you can’t change your hosting provider or access the server directly. Shopify manages your hosting infrastructure, which can limit your ability to make server-level optimisations. However, you can upgrade your Shopify plan to a higher tier for improved server resources.
- Change CDN (Content Delivery Network): Shopify provides its CDN infrastructure, and you can’t switch to a different CDN service. Shopify’s CDN is tightly integrated into its platform for optimised content delivery.
- Change Shopify Core Code: Shopify’s core code is proprietary, and access to it is restricted. You can’t make direct changes to the platform’s core codebase. Instead, you can customise your store’s appearance and functionality using Shopify’s theme system and the Liquid templating language.
Despite these limitations, Shopify offers a highly secure and user-friendly ecommerce solution that can be optimised effectively within the framework it provides.
You can still significantly improve your store’s speed and performance by following best practices and leveraging the available customisation options.
Using Tools for your Shopify Website Speed
Like with any job it’s important to use the right tools to help you do a good job.
You may want to do the speed optimisation yourself, but in some cases it’s better to get a professional to do the job.
Shopify Theme Inspector Chrome Extension
If you have a technical background then this Chrome extension could be very useful.
Simply run it when you’re loading any page on your website and it will give more information on what sections in the page are causing slow page speed and so on.
What we like about it is that you can drill down into blocks and it gives great insights into what else can be improved.
Sometimes you will find that certain sections or code is adding extra weight to your page, and you may realise you can remove them or use something else.
Use Tapita SEO
We’ve used a range of Shopify apps to help with pagespeed and they all work slightly differently and to be honest some didn’t even work that well.
We were very surprised with Tapita SEO however.
It’s a fairly new app but in short it really improved pagespeed – very quickly.
We found it quite surprising how quickly the app worked, and we were a little dubious about the results but after a few months of testing we can say it does work.
Just to clarify that – this app will improve your pagespeed scores, however it does that by fixing one key metric.
By fixing this one issue, it helps to boost the overall score, and so far we haven’t seen it negatively affect anything.
You should still definitely do other optimisations, but using this plugin will help too.
Get Help To Improve Your Shopify Website Speed
If you have a Shopify site which is outdated or you are using a theme which seems sluggish then it’s time to get in touch with us.
We can take a closer look at your website and the underlying code to recommend changes as well as look at ways to make it load faster.
All it takes is a quick email to us and we will be able to help with making your website easier to use.