Is your WooCommerce store eerily slow? Does this have you worried? Well, it should because studies have shown that 67% of UK shoppers and 51% of those in the US claimed that a slow site is the top reason they’d leave.
In addition, only a 1-second delay can result in a 7% reduction in conversions. A 2-second delay in load time during a transaction resulted in abandonment rates of up to 87%:
Humans have limited patience when it comes to online browsing and slow websites contribute substantially to throwing visitors off because of the time that it takes for them to load and display the relevant information. Optimizing the speed of a WooCommerce website will significantly improve your core web vitals score, but it is a tricky business and the processes involved requires different considerations.
Want to know how to optmize your WooCommerce store for maximum speed?
Grat, here’s how!
Start by analyzing the current speed of your WooCommerce store (no servers involved yet)
For any performance optimization work, you need to know what’s your current state. Gathering data as your first step provides you with a key benchmark. It helps you ascertain the extent of optimization that is needed, and in what areas. It is important to note that the first step is to asses your site speed only, leaving servers untouched for the moment.
To perform this type of assessment, you’ll usually use online tools you might have already heard of, namely GTmetrix, Pingdom, Google Site Speed tool are the most well-known and recognized for this task.
When hiring a developer, this early part of the work doesn’t need your login credentials to be shared.
After the frontend speed of your WooCommerce store, it’s time to analyze where your store “lives”: your hosting provider.
Examine your hosting provider, CPU, and PHP version
Once you’ve determined the speed of your store on the frontend, the next step in line is to check the hosting provider your store is hosted on. This means looking at your hosting servers stack and configuration at first, but not only. As WordPress developer and Codeable expert Milan Latinović there are more elements to check:
After having looked at your hosting configurations and speed, we also need to investigate other crucial elements affecting the speed of your WooCommerce store. Specifically, we’ll look at the CPU usage, RAM usage, and PHP version your store currently uses.
Analyze caching mechanisms
Once you collect data both from frontend and servers, it’s time to dig deeper into your caching setup. If you have no idea of how caching works, I suggest you read this short anecdote from Peter Chester. In short, cache works similarly to snapshots of a given page (or query) which are then stored in an efficient way so that, when requested again, your store doesn’t have to go through the same process from scratch and can serve data faster to your users. Highlights Milan:
When we talk about caching system for a WooCommerce store, our goal is to find the most effective way to deliver the smallest amount of information that’s not compromising the user experience.
Caching can be configured client-side, via your users’ browser, and/or server-side, via the servers provided by your hosting providers.
Check whether WordPress core files, WooCommerce, and themes are all up-to-date
This is a problem often overlooked by store managers: since the store gained some popularity, the importance of updating it gets undermined. This is a common yet counter-productive approach to running a store (and, more broadly, any site) because it won’t only lower the security of such WooCommerce store but, as the goal of this article, it won’t allow it to reach better performances. As Milan recalls:
In my experience, 90% of WooCommerce stores run some outdated versions of their software and that’s what leads to them to having slower pages. The most updated
stores are those that are not selling actively because they’re new ones.
Image optimization strategy
Image optimization is another important element to take care of, especially with large WooCommerce stores featuring numerous products that are accompanied by relevant images. The strategy for image optimization is three-pronged:
1. Automatic image optimization
When you hear someone talking about “Image optimization”, most of the people think it’s a matter of using a script or plugin to do that for you like Kraken, TinyJPG, or any other image optimization tools. Even though this a great and easy win, when it comes to making your images weight less, it’s just one of the things required in a full image optimization process.
2. Optimize template images
There’s a special type of images that can’t be optimized automatically by a script or plugin. These images are embedded into the template used to design layout of your store and aren’t accessible to external tools or plugins. As a result, these images have to be manually tweaked and then re-uploaded to start having some beneficial results.
3. Normalizing images
The third part of the image optimization process is to normalize images against your template’s image size requirements. Let’s say you’re using a 1000 x 1000 px photo when it should be a 200 x 200 photo. Sure, the code on the page will try to render it properly but your store is still loading it at its original size and now tries to shrink it to show it as your settings require.
What’s happening here is that not only your store needs more time to go through all these activities (uploading image › shrink it › show it) but it also needs more resources, namely more CPU and RAM. The result: slower pages and higher server resources required to go through a process which could have been streamlined in the first place.
Using images with the wrong size means two things: a) your store is loading more than it should and b) your store is executing additional scripts to fix the issue which you initially created using that wrong-sized image.
Optimizing images on your store can provide you with great results but it’ll require a reasonable amount of time to be invested in.
Script selection and optimization
If we’re talking about time-consuming tasks occurring during a WooComerce store optimization process, script selection and optimization is surely at the top of the ladder. Scripts are actually the most complicated part of the entire speed optimization process.
Let me try to quickly explain why.
In short, there are different iterations of scripts running on the backend and the frontend of your store. Those running in your backend are not meant to run on the “front”, for your customers; the ones pertaining to your frontend, as you might have already anticipated, can’t be run on your backend. This means that scripts for both have to be optimized individually in order to enhance the speed of your store.
On top of that, everything has to be tested to see if all is working like a charm. However, the process is not as easy as it might sound and, sometimes, clients hardly understand the intricacies of why script optimization require so much time. Milan points out:
When doing script optimization, we have to spend several hours, sometimes even 10 hours, just to reassemble already-existing scripts. All without having created a single line of code.
Multi-language optimization
Stores are usually universal or they cater to people from different countries which means that they have to support different languages. This is where multi-language optimization comes into play and this is extremely important because, if not handled properly, it can spell disaster for the entire project. Milan explains:
usally, store managers either use a premium solution like WPML or some kind of automatic translation mechanism. If we don’t have a properly-optimized WooCommerce website implementing multi-language support, we’ll increase issues exponentially.
A multi-language optimization process can happen in two ways: you either optimize everything for WooCommerce and then add a plugin like WPML. Or, the opposite: you optimize a website which is already using a localization plugin and then you add WooCommerce to it.
Wrapping up
Speeding up and optimizing a WooCommerce site is important to keep your sales conversion rate as high as possible. The optimization process has a number of steps that require extensive efforts whether by your in-house developer or by an outsourced WooCommerce specialist.
If you’d like to grow your store business, that’s surely one of the most effective and powerful enhancement you’ll be required to perform. Unless you’re ok having a couple of seconds jeopardize your revenue stream.
This blog post features Milan Latinović, a software developer and team lead with 8+ years of experience and strong technical background in PHP, GIT, infrastructure (virtualization, provisioning, integration) and security. Experienced both in technical and the domain of management (project scoping, planning and implementation), Milan specializes in WordPress optimization, WooCommerce, Security and LSPs – large scale project deliveries. He is also an official WPML contractor and Phd researcher in the field of semantic databases and SQL optimization.
