How to speed up WooCommerce?
Ask any brand or business, small or large, and you will discover that this question is a shared concern.
It is no longer a secret that slow WooCommerce stores can cost you in many ways: downward-pointing business metrics (rebound, conversions), increase in cart abandonment, and a very noticeable dip in customer loyalty, brand image, visitors, and even SERP visibility.
Nobody likes to wait in real life or online. This very important fact is the reason why almost all ecommerce stores now prefer Web Performance Optimization (WPO).
In today’s article, I will tell you everything you need to know about speeding up your WooCommerce stores to the maximum and making sure the store remains an important component in your online business setup.
- What Is the Optimal Load Time?
- How to Measure Web Performance?
- 13 Tips to Speed up WooCommerce
- Start with Spring Cleaning
- Optimize WooCommerce Images for Web
- Go for Reliable Hosting
- Optimize WooCommerce Website Code
- Optimize HTML Code
- Minimize Redirects
- Increase WordPress Memory Limit
- Use Server and Browser Cache
- Improve Web Design
- Choose Lightweight Theme
- Add WordPress CDN
- Lazy Load for Images and Videos
- Update Everything Often
What Is the Optimal Load Time?
There is no stipulated optimal load time. However, the popular expert advice is to keep it below 2 seconds. As you can guess, page load time is an important performance metric in WPO. If your WooCommerce store loads up in more than two seconds, you have your work cut out for you.
According to Google’s page and load time stats, the probability of a visitor leaving a website is as follows:
– Source: Google
Surely at this point, you will ask yourself, “How to improve the page load time and not lose customers?”
How to Measure Web Performance?
There are different tools available online to measure the loading time of a website. I recommend three tools with which you can get multiple performance metrics for your website.
1. PageSpeed Insights
PageSpeed Insights provides technical advice on Web Performance Optimization (WPO) by priority. I strongly recommend you resolve issues of high and medium importance first to ensure that there are no critical performance issues.
Note that a bad rating does not necessarily signify a slow store. However, solving these issues could have a serious impact on the performance of a WooCommerce store.
GTmetrix is a great tool to use when you want to optimize your WooCommerce store. Just put in your link, and it’ll tell you the current performance of your store. It’ll also tell you the areas of improvement that you can handle and boost your store’s performance.
3. Pingdom Tools
Pingdom Tools helps you test the speed of a WooCommerce store within seconds. The standard version of Pingdom Tools has the advantage of being free, but a paid version is also available that offers additional features targeted toward professionals.
Fast Hosting + Optimized Stores = Better Conversions and Profits
Cloudways WooCommerce stack is loaded with the latest tech, which includes NGINX, Apache, MySQL/MariaDB, and more. Plus, the managed experience makes it all easier to manage the store!
13 Tips to Speed Up WooCommerce
Now that we know how we can test our site performance, let’s take a look at the 10 tips that will help you improve the performance of your WooCommerce store.
1. Start with Spring Cleaning
Eventually, WooCommerce stores become slow because of the clutter that mounts up the databases at a frequent rate. Here are several important areas of the “spring cleaning” that help you speed up WooCommerce stores.
1.1. Limit the Number of Extensions
It is not the number but the quality of the extensions used that matters. On the other hand, the more active extensions you have, the more difficult it becomes to control the quality. It is, therefore, a good practice to inventory your extensions regularly and ensure that the active extensions are relevant. If you have the opportunity, replace some extensions with an equivalent code, this is a good practice for WooCommerce optimization.
1.2. Limit/Disable Revisions
WooCommerce offers a default revision check on product pages, allowing you to go back and view changes to the product pages. While this may seem like a good thing, revisions can also lead to WooCommerce performance problems.
For example, let’s say you create a product page and work on it five times, changing a word or two each time. Although the change is minor, you have six copies of your original product page. This can quickly degenerate and slow down WooCommerce performance in the end.
To limit/disable the revisions, insert one of the following lines in the wp-config.php file located at the root of your website.
define ('WP_POST_REVISIONS', false);
Limit the Number of Revisions
define ('WP_POST_REVISIONS', 3); // limit to 3 revisions
Note: 3 indicates the number of revisions. You can change it as per your requirement.
1.3. Clean up the Database
You already know how to limit WooCommerce product page revisions. However, you also need to remove the revisions already present in the database. For this, there is nothing better than the WP-Optimize plugin.
WP-Optimize not only removes problematic revisions but also cleans up the entire WooCommerce store database. It is also possible to automate the cleaning process so you can work on it without any pauses.
1.4. Limit External Resources
An external resource is simply a script, a style sheet, or a font that is not on your WooCommerce server. Even Google Analytics is an external resource!
It is important to limit the number of external resources to the minimum because you cannot optimize every resource. In almost all cases, these external resources slow down your store. A good way of minimizing the dependency is to use credible sources, such as Google Fonts that take care of all font-related issues.
1.5. Widget and Sharing Tools
Social sharing widgets such as Facebook and Twitter can slow down your WooCommerce store significantly. On your store, these widgets slow down by:
- Downloading external resources
- Internal dependency on DNS queries
- Adding additional HTTP requests
- Increasing the size of the page
WooCommerce store owners should remove these widgets and use simple share buttons, as it is a good WooCommerce speed optimization technique.
1.6. Affiliated Ads and Products
Affiliate ads and products are no exceptions.
If you run ads on your WooCommerce store, use a single network and do not run wild with ad placement. If you use Google AdSense or any other ad service, why not cut the pear in half and leave out only one of the two?
Affiliate ads are often in the form of images hosted on external servers. A better alternative is to host the images yourself, thereby optimizing the images and reducing DNS queries.
1.7. Limit Installed Plugins
As a rule of thumb, you should only install the most essential plugins on your site. In all cases, you should select the plugins with the reputation of speed and performance. To assess plugin speed, I recommend Query Monitor, a great tool that gives a good idea of how long it takes to load each plugin and if it is worth keeping it on your website.
2. Optimize WooCommerce Images for Web
Image optimization is essential for the overall WooCommerce speed optimization for online stores.
Indeed, images often represent the majority of the bytes downloaded for a page. As a result, image optimization often results in a reduction of page size; hence, it helps you speed up WooCommerce stores. This also has the benefit of reducing the consumption of client bandwidth.
Understand that optimizing store performance is not “one-size-fits-all”. This means that I will not give you specific plugins but describe general strategies for image optimization.
2.1. Eliminate and Replace Images
The very first question you need to ask yourself is, “Is this image necessary?” Good design should be simple without image overload. As we know, a well-placed image transmits more information than a thousand words. It is up to you to find the right balance.
The following three tactics are often deployed for image optimization on WooCommerce stores.
- Base64: This technique is as old as the Web. It allows you to reduce the number of requests to the server and display images instantly. Be careful not to abuse Base64 and use it on small images because this can affect the size of your product pages.
- Inline SVG: The inline SVG offers all the advantages of Base64 encoding but none of the disadvantages. Beware, inline SVGs are not supported on older versions of popular browsers.
- Sprites: The Sprite CSS is also a very old technique for optimizing the display. When you develop your WooCommerce theme, it may be beneficial to group most of your small images into one.
Note that if your store is on HTTP/2, the above three tactics will be counterproductive.
2.2. Image Formats
The right image format can make a significant difference in the page load speed of your store.
- JPG: Use JPG for photos, high-resolution images where you need to show a lot of details.
- PNG: Use PNGs for icons, logos, illustrations, transparent images, etc.
- GIF: GIFs are not so bad for small images, but they are very rarely superior to PNGs. So, use GIF only when you want an animation.
2.3. Image Dimensions
Be careful not to upload unnecessarily larger images than necessary on your store. Resize images manually or use a plugin such as Imsanity to automatically resize images to acceptable dimensions.
2.4. Image Compression
You can compress images manually (through Photoshop), but it is tedious, to say the least. I tried many extensions to optimize the images, and I came to the same conclusion as Matt Cromwell.
Compress JPEG & PNG images plugin offers the best WooCommerce performance, besides being easy to configure. You only need to get an API key, and the plugin is available to your store. The extension is free for up to 100 images per month. This should prove to be sufficient for many WooCommerce stores.
2.5. Responsive Images
What if a mobile visitor visits your store? A 1200px image is inappropriate for him. That’s why some developers, such as Cris Croyer from CSS-Tricks, have created the RICG responsive images plugin that will display the right image size based on the screen width.
3. Go for Reliable Hosting
In many ways, hosting is the MOST IMPORTANT factor that affects WooCommerce store performance. Indeed, the underlying hardware architecture is responsible for handling the traffic and serving the relevant data to the users. Thus, the Fastest WooCommerce Hosting should be your first priority.
It is best to choose a hosting provider that:
- Provides data centers across the world
- Offers CDN and SSD-based storage
- Integrates performance-boosting technologies
Note: It is important to choose the server closest to your audience, as it will reduce server response time.
Without talking much about the traditional (Shared, Dedicated, and VPS) hosting solutions, I will only discuss Cloud Hosting.
Give Blazing Fast Load Times to Your Visitors With Cloudways!
Our optimized tech stack with NGINX, Apache, MySQL/MariaDB, and more is specifically created for WooCommerce stores that want nothing but the best performance!
3.1. Cloud Hosting
Cloud hosting offers the best mix of performance and costs for WooCommerce stores. The good thing is that most of the cloud hosting providers follow a pay-as-you-go model that ensures that you pay only for the resources that the store actually consumes.
During the holiday season, the traffic and user requests increase exponentially, and traditional hosting solutions could fail in such scenarios. Thanks to the scalability of cloud hosting solutions, businesses can continue to grow despite the load on their WooCommerce store.
3.2. Managed WooCommerce Hosting
If you do not want to spend too much time configuring your servers for optimal WooCommerce performance, managed hosting for WooCommerce is the best solution for your store.
All market-leading managed hosting solutions include 1-click free backups, firewalls and other security measures, server upgrades and patches, and support by WordPress experts.
4. Optimize Website Code
The number of files on a WooCommerce store can be staggering for many users and the number continues to grow over time. The result is slow WooCommerce stores, as the visitors’ browsers have to load up large files for every page.
4.1. File Compression
4.2. CSS Resources
There are several techniques for optimizing CSS resources. One of them is simply keeping the number of style sheets to a bare minimum.
The browser must wait for a full load of all stylesheets before displaying anything to the visitor. By reducing the number of style sheets, you considerably speed up the WooCommerce store for visitors.
It’s good to reduce the number of style sheets, but with WooCommerce, it’s almost impossible. Themes are very often focused on “features,” and there is, of course, a style sheet for every feature.
It is possible with a plugin like Breeze to concatenate these files easily. Beware that concatenation is a delicate operation and it is common for this operation to break your live WooCommerce store. I recommend it to test on a staging site first.
Unlike style sheets, it is possible to render “ASYNC” scripts to no longer block the display and thus speed up WooCommerce stores. Sometimes concatenation and change of loading type can also break WooCommerce stores. The more scripts you have, the more difficult it will be to optimize them.
5. Optimize HTML Code
Your HTML code is the roadmap for servers to read.
Through this map, the server can compile and deliver the pages requested by the visitors. However, note that it is your responsibility to keep your code as clean as possible.
Things like additional spaces and hidden texts (for black hat SEO) in your code can have a big impact on the load time of the page. Experts suggest going through your code with a fine comb to speed up your WooCommerce store dramatically.
6. Minimize Redirects
Think of your WooCommerce store as a map.
Every time someone clicks on a link to a page on your store, the server counts it as a redirect. Essentially, the server has to divert visitors to the correct location. Although this only takes a few seconds, it may seem like an eternity to the users and is a direct contributor to the bounce rate of your store.
If you have tons of redirects throughout your website, you are eating into server resources and increasing the final page load time for the visitors. Thus, if you can reduce the number of redirects, you will see a significant jump in the page load speed, as it is a proven WooCommerce optimization technique.
7. Increase WordPress Memory Limit
As a default optimization mechanism, WordPress has a PHP memory limit of 32MB. This is the amount of memory that’s used to run scripts for your WordPress websites. This also means that the website will use limited resources on the server.
However, this can limit your WooCommerce store’s performance because they are usually pretty data-heavy. To optimize the store, you should consider increasing your WordPress memory limit. Pushing the limit up to 256 MB can make your store faster and better performing.
Note: Before you change the settings, ensure that you have a backup. In case things go haywire, you can upload the backup and prevent data losses.
8. Use Server and Browser Cache
Breeze WordPress cache plugin is honestly not easy to surpass in terms of WooCommerce performance and ease of configuration.
Developers tested the different cache plugins and discovered that Breeze performs significantly better. This is particularly important because the more complicated a plugin is to configure, the more likely it is that users will make configuration errors.
8.1. Server Cache
A WooCommerce store is dynamic, and you need to make it static to speed it up. Otherwise, each of your server must fetch all the assets from the database and waste valuable time. If your server supports a caching solution, it would simply return the HTML.
8.2. Browser Cache
9. Improve Web Design
Good performance always starts with good design. This is what Brad Frost preaches in an article that has become an apology to performance. He says:
Ultimately, performance is about respect. Respect your users’ time and they will be more likely to walk away with a positive experience. Good performance is [a] good design. It’s time we treat it as such.
Does your WooCommerce storefront start with a huge carousel? Are you aware that carousels are virtually useless? Does your WooCommerce store load a video or an HD image in the background? Does your store display all social widgets?
If so, do not forget that all these design elements have a direct impact on the speed of your WooCommerce store. No one prevents you from integrating these elements. I just want to mention that if performance is a priority, you will have to make a choice!
WooCommerce Stores Need a Reliable Hosting Stack
See how Cloudways helped Silicon Dales to manage their hosting stack
10. Choose Lightweight Theme
In many cases, the aesthetic decision of a website is on the designers’ end who does not take into account the page load speed. As a result, often the aesthetics of the frontend takes precedence over the page load speed.
When finalizing the theme of your website, I strongly suggest picking a theme that is lightweight and optimized for performance. In addition to being responsive, the theme should have a clean codebase that prioritizes speed over aesthetics.
11. Add WordPress CDN
If your WooCommerce store serves customers globally and has a lot of multimedia content or styles to make it much more impressive, I advise you to add Content Delivery Network (CDN). It serves static elements of your store from the location closest to the visitors. This significantly improves the page load time and user experience eventually.
12. Lazy Load for Images and Videos
This is crucial. Whenever you go to a page, its resources load all at once. That means it’ll take more time and display the content with delays. With the Lazy Load technique, your site will only load the content for folds that need to be displayed. This can drastically improve your web page’s load time and help your store rank better on the SERPs.
Besides enhancing performance, there are so many other benefits of lazy load. Some of them are:
- It conserves bandwidth because it only shows and loads the content when it’s requested.
- Conserves the resources of your visitors as well.
- Even data-heavy pages, which can take several seconds, can load in significantly less time.
13. Update Everything Often
If you want to win the WooCommerce speed game, you should have everything in its most updated form. Be it the WordPress version, plugins, or your theme. Old versions aren’t optimized and can slow down your website. In some cases, not updating the plugins or themes can even mean risking your website crashing.
Also, if you are using plugins that developers have stopped updating for a long time or discontinued support, it’s time to let them go. Find better alternatives where developers regularly contribute and offer support.
With all the tips and techniques mentioned, it is time to improve WooCommerce performance. If your WooCommerce store takes more than 2 seconds to load, you should start worrying as it will negatively affect everything: from user experience to SEO ranking.
It’s your turn now! Have I missed anything? If YES, please feel free to share that in the comment below.
Q. Why is my WooCommerce site so slow?
A. Your WooCommerce site could be slow for several reasons, such as:
- Heavy or unoptimized WooCommerce theme.
- Cheap or shared hosting.
- Lack of lazy load for pages with heavy images.
- Improper caching
- Outdated plugins, themes, or WordPress version
Q. How do I speed up WooCommerce checkout?
A. You can speed up the WooCommerce checkout process by:
- Allowing guest checkouts.
- Keeping the checkout steps to a minimum.
- Not asking for irrelevant information from the customers.
Q. How to speed up your WooCommerce store for higher conversion rates?
A. There are several things you can do to speed up your store for higher conversions:
- Use optimized WooCommerce hosting.
- Choose a lightweight and WooCommerce-optimized theme.
- Implement lazy load for heavy pages.
- Avoid heavy plugins.
Passionate about technology, entrepreneurship, and marketing, Mansoor Ahmed Khan is in computing since he knows how to type on a keyboard. His daily life is rocked by his family, projects, and his screen. Probably in this order, he likes to be convinced at least. You can reach out to him at [email protected].