Shoppers increasingly expect a positive user experience and WooCommerce stores have been embracing new tools like personalization, live chat, real-time inventory, and more to address it. Despite that, these features, if not executed correctly, often leads to a potential conversion killer — a slow website.
Here’s the bad news: a slow website that takes longer than 3 seconds to load will be abandoned by 40% of shoppers. The slower your WooCommerce store, the higher the abandonment rate. And this generally translates to a lesser revenue. In addition, a slow page down ranks your store in the search engine results page.
Here’s the good news: While shoppers’ patience for a sluggish website is tailing away and demand their online shopping experience at a lightning speed, as WooCommerce merchants, there’s definitely something you can do to speed up your store’s loading time.
Today, we’ve outlined a few simple steps and best practices that WooCommerce stores can take to remove these speed bumps and ensure that all shoppers’ need for speed is constantly met.
—
If you’re in the search of products to sell online that really get sold, enjoy our bonus here:
How to measure the loading speed of your site
Now that you know that your website’s speed is crucial in your eCommerce conversion, the next step is to find the slow website culprits. Why isn’t your page loading fast as expected? What are the things that you’re probably doing wrong?
A website speed test will help you analyze how fast or slow your site loads and identify what possible bottlenecks are causing your poor performance, such as connection data rate and latency.
Several tools are already available for you to conduct this. Here’s how to measure your website speed and loading times using the most popular speed test tools:
Google PageSpeed Insights
A recommended start to measure your site’s loading speed is using Google PageSpeed Insights. It reports the real-world performance of a page for either mobile and desktop devices and provides recommendations on how to optimize that page.
The first step is to type the URL of the page you want to analyze in the ‘Enter a web page URL’ box and then click on the ‘Analyze’ button.
Two clickable reports on your mobile and desktop performance will be available. It incorporates data from the Chrome User Experience Report to show your separate mobile and desktop page speed score, optimization score, page load distributions, and page stats just like below.
The ‘Page Speed’ is how the tool classifies your overall speed performance. This falls under the following distribution:
- Fast: The median value of the metric is in the fastest third of all page loads.
- Slow: The median value of the metric is in the slowest third of all page loads.
- Average: The median value of the metric is in the middle third of all page loads.
However, you have to pay attention to your First Contentful Paint (FCP) and DOMContentLoaded (DCL) scores as highlighted in the above image. What are these scores about? According to PageSpeed Insights:
- “First Contentful Paint reports the time when the browser first rendered any text, image (including background images), non-white canvas or SVG. This includes text with pending web fonts. This is the first time users could start consuming page content.”
- “DOMContentLoaded reports the time when the initial HTML document has been completely loaded and parsed, without waiting for stylesheets, images, and subframes to finish loading.”
The good thing also about the report is it suggests how you can improve your page. The ‘Optimization Suggestions’ displays clickable portions of different rules for optimization. The tool also will let you know what optimization rules have been applied.
To learn more about PageSpeed Insights, visit these guides from Google.
GTmetrix
Another alternative is using the report from GTmetrix. In your first run, you might be seemingly overwhelmed by its data which is far more technical than the ones from PageSpeed Insights. This is a good route for WooCommerce merchants who want to deep-dive their analysis.
You will be displayed with Performance Scores and Page Details metrics. Read more about them at PageSpeed/YSlow scores and how they affect performance.
The optimization recommendations in GTmetrix are more robust which gives you more flexibility to pinpoint the root causes of your speed problems.
The report highlights dozens of different aspects to improve your page loading times. It also grades each of the aspects from A to F (F being critical). A critical grade means this area needs attention. Each issue is also clickable to give you more insights. It also ranks the issues in order of priority.
Other Speed Testing Tools
Aside from PageSpeed Insights and GTmetrix, you can also check out other speed testing tools such as Pingdom, Load Impact, and Show Slow depending on your needs and preferences.
7 effective ways to speed up your WooCommerce store
Depending on the results that you have uncovered from the speed test report, now you are ready to optimize your slow WooCommerce site. Here are a few ways to speed things up:
1 – Increase WordPress Memory Limit
WordPress default memory is set to 32 MB and it’s expected to exceed this at some point and get a fatal error message. To address your WooCommerce memory limit issues, there are two ways: you can either adjust it yourself or contact your hosting company. But, you can definitely configure this by following the steps below:
Edit your wp-config.php file
- Open wp-config.php, which by default is located in the root WordPress directory.
- Find the following line near the end of the file: /* That’s all, stop editing! Happy blogging. */
- Just above that line, add the following line: define(‘WP_MEMORY_LIMIT’, ‘256M’).
- Save your changes.
Edit your PHP.ini file
- If you have access to your PHP.ini file, change the line in PHP.ini
- If your line shows 64M try 256M: memory_limit = 256M ; Maximum amount of memory a script may consume (64MB)
Edit your .htaccess file
- If you don’t have access to PHP.ini try adding this to an .htaccess file: php_value memory_limit 256M
2 – High-quality hosting services
A hosting service facilitates the use of a host server to store your website contents such as media and files. Hosting is the foundational architecture that handles your traffic and relevant data. Thus, it adversely affects your WooCommerce store performance if low-quality hosting is used.
An increasing traffic base and thousands of product pages can slow down your website, especially if your hosting can’t handle this growth. Choosing a high-quality and fast hosting service for your WooCommerce store must be a top priority.
Types of eCommerce Hosting Services
There are various hosting options available for you. You should align your hosting service depending on your budget, size, and goals. Here are the most popular types of hosting services:
Qualities of a High-quality Hosting Provider
A good quality hosting provider must bear the following qualities:
- 24/7 technical support to resolve your issues and answer your questions.
- Top-notch cloud infrastructures.
- Flexible to adapt to the changes as your WooCommerce store grows bigger.
- Data centers all over the world.
- High uptime so that your visitors can always reach you.
- Provides an SSD based solution.
- A server close to your audience to positively affect your response time.
Recommended Hosting Providers for a Faster WooCommerce Store
Both WordPress and WooCommerce officially endorse these three hosting services:
- SiteGround – high-performance WooCommerce hosting with free SSL, PCI Compliance, auto-updates, daily backups, and expert 24/7 all-channel support
- DreamHost – the highest rated web hosting service by PCMag. It includes server-level caching, built-in WAF security, free domain and privacy, and 24/7 expert support.
- BlueHost – “the ultimate WordPress platform” according to WordPress. It contains one free domain, free SSL, unmetered bandwidth, dedicated IP address, and 24/7 WooCommerce support.
3 – Use cache plugin for server and browser
Caching essentially enable merchants to speed up their WooCommerce stores by caching or storing a copy of the store’s resources. It lessens the amount of data being sent between the shopper’s browser, the database, and the server so that future requests for that data can be served faster.
In brief, you need to pay attention to the following:
- Server Caching: The server is responsible for generating the web page, server caching allows it to recall how that web page looks like so that it won’t generate it again the next time.
This saves more time because the server won’t have the trouble of constructing the whole page again. And since a WooCommerce store is dynamic, you must ensure that it’s static to speed it up.
- Browser Caching: Browser cache is responsible for remembering how a web page looks like so it won’t have to ask the server to send the web page all over again.
This is especially good for visitors who visit multiple pages because all static files like stylesheets and JavaScript files can already be stored by the browser. This speeds up the viewing of the pages even if it’s done frequently.
Recommended WooCommerce Caching Plugins
WordPress provides a wide caching solutions to generate a faster page loading easily. Here are the most popular ones:
- Breeze WordPress cache plugin: It has file exclusion feature, combines and minifies your HTML, CSS and JS files, and minimizes the file size and download time through Gzip compression.
- WP Rocket: Its features include cache preloading, browser caching, GZIP compression and HTML, CSS and JavaScript minification and concatenation. It also has a lazy image loading feature to load images only when the user scrolls down your page.
- W3 Total Cache: It has a devoted settings page for every caching type – database caching, browser caching, page caching, object caching, etc. It has an overwhelming level of customizability.
But, take note that if you’re using caching plugins, exclude your cart, my account, and checkout pages from the cache. These pages have to be dynamic since they contain information particular to the current customer.
4 – Compress product images
WooCommerce stores loaded with hefty images and large image files can slow down your site. Images eat up 51% of all web content and also make up for 50% of the page load time. This is why optimizing and compressing your product images is a must.
To deal with this, you can either manually compress your images through Photoshop which you know is tedious or use automatic image compression and optimization plugins for your WooCommerce store. This will allow you to reduce your image sizes without compromising the image quality.
Recommended WooCommerce Image Compression Plugins
- WP Smush: Lets you compress any images in your directory to help you optimize all the images on your site.
- Imagify: Automatically compress your JPG, PNG and GIF files, reducing the size of your images by as much as 70%.You can also specify the image height or width.
- ShortPixel: It has a stable, comprehensive, up-to-date image compression solution. It can also optimize any images even those that are not listed in your Media Library.
5 – Use CNDs (Content Delivery Network)
A content delivery network (CDN), also called content distribution network, is a framework of distributed servers that deliver pages and contents to a web user. It is based on the user’s geographic location, the webpage origin, and the content delivery server.
When a customer visits your WooCommerce store from a place near a server where your site is stored, the contents won’t have to transfer far from the shopper’s browser. But if the server and the customer’s location are far each other, the contents have to travel much further, prompting a slow page load.
A CDN service can help resolve the geographical distance problem, especially for WooCommerce stores with an international presence. What it does is to serve content from an ‘edge server’ that is either closest to or most efficient for each individual end user, based on where they are located in the world.
Well-known CDN services available for you are the following:
6 – Disable AJAX Cart Fragments in WooCommerce
The AJAX Cart Fragments feature in WooCommerce is a script which makes use of Admin-Ajax to automatically update the customer’s shopping cart total without having to refresh the page. This is particularly useful in generating an instant feedback to the shoppers with the items they added to their carts.
Despite that, this kind of function has the tendency to slow down your site’s speed performance or may even interrupt the caching on pages that do not need cart details. So, if you notice a high number of AJAX requests on your WooCommerce site, simply disabling AJAX Cart Fragments can help enhance your website’s stability and speed.
You can fix this issue with the wc-ajax=get_refreshed_fragments. But you may want an easier solution using the Disable Cart Fragments plugin to automatically disable the AJAX cart fragments feature in your WooCommerce store. But, remember to redirect customers to the cart page when using this plugin.
7 – Clean the database
A database is a system that organizes and stores your data. In the context of eCommerce sites, these data fall under the following:
- Site Content: It’s the data that generates the dynamic HTML pages like content pages, product pages, and category pages.
- Transactional Data: It’s the data that resulted in a user’s actions. It often includes the order details of your customers and inventory updates.
If you require large data, try to organize hundreds of products or have a very complex database, it may take a while to process the request which leads to a slow server response time. Cleaning up your database will help you improve your page loading speed and it also unloads a considerable space for your WooCommerce store to run faster and more smoothly.
You can use WordPress plugins to help you clear up your database such as:
Need for Speed
Online shoppers expect a highly engaging and personalized WooCommerce store without compromising the site’s speed. This is because a slow website has a direct correlation to a high abandonment rate. And, a high abandonment means a lesser revenue.
While eCommerce stores need to supply ample features and experiences to engage with their customers, shoppers also demand the need for speed. To deliver rich, responsive, and fast WooCommerce store, use our proven ways to speed up your website today.
Recommended for you
