Online consumers are notoriously impatient. In today’s competitive e-commerce landscape consumers expect websites to load fast and without delay – instant gratification. So as a webmaster or entrepreneur, it’s in your interest to do everything possible to make sure your website loads as fast as possible – a slow WooCommerce website is simply not an option.
Concretely, here are four reasons how a fast WooCommerce site can help your bottom line:
- A fast website can help increase your conversion rates and reduce cart abandonment.
- A fast website can lead to improved rankings in Google and Bing.
- A fast website will offer a better user experience to your visitors which may lead to more page views and time spent on the site.
- No one wants to be associated with a slow loading website.
Optimizing a WooCommerce site may seem like a daunting task for many, but in this article, I will review some of the steps you can take to fine-tune your online store.
Whenever someone tells me that they have a slow website, the first thing I do is carry out an online speed test. Speed tests can provide all sorts of helpful information ranging from load time, site size, on-site optimization tips and can pinpoint the assets that are slowing down the site.
Some of the best online speed test tools include:
Of interest when carrying a test, is the “Waterfall View”. A detailed report outlining the load time of your site’s assets.
Most start-ups kick-start their business by signing up for a low cost shared hosting package. It most cases, it’s the logical choice. However, as your traffic starts to grow and product catalog gets bigger and bigger, your hosting provider may struggle to keep up. Shared hosting plans don’t allocate much disk space, memory or bandwidth.
One suggestion, before proceeding with the next steps, would be to contact your hosting provider to discuss the impact your hosting plan has on your website’s performance.
You have probably read a few reviews and posts about content delivery networks (CDN), and that’s because they are a great way for webmasters to speed their websites.
A CDN is a network of servers that are strategically located across the globe with the purpose of accelerating the delivery of your static web content such as your images, CSS and JS files.
A server on the network is known as a point of presence (PoP). They are the servers used to cache your site’s content. Therefore, when a user makes a request to your site, assets will be served from the closest geographical point of presence (PoP). As a result, your site may see improved performance since your content will be delivered faster to your website’s visitors as there is less distance to travel.
KeyCDN is a popular CDN service, have a look at this article about setting up the service with WP Rocket.
Caching is a critical part of a website’s performance. To get a better understanding of web caching, check out Wikipedia’s explanation. In simple terms, in computing, caching is a hardware or software component that stores data so future requests for that data can be served faster.
In WooCommerce, when your shop is cached, we are implying that your pages, images, files and web objects are stored on a local hard drive. Therefore, a browser doesn’t have to retrieve new information every time the site is accessed since a readily available cached file/s can be served – resulting in a faster load time.
To enable caching on your site, you have several great plugins to chose from, but most notable are WP-Rocket and W3 Total Cache.
W3 Total Cache is one of the most popular WordPress plugins in the WordPress repository. To its advantage, the plugin supports a boatload of features including CDN support and GZip compression. However, there are so many features that installing the plugin is a little daunting for most users.
Alternatively, one can install WP-Rocket. WP-Rocket is a premium plugin starting at $39 per license and $199 for a developer license. They offer all the features of W3 Total Cache packed into a beautiful and easy to understand user interface coupled with on-demand support.
Minification & Concatenation
The number of CSS and JS files needed to build your theme and WooCommerce store can be staggering! In order to cut back on HTTP requests and reduce the file size of your assets, you can minify and concatenate your files.
Minification removes unwanted spaces and characters from JS and CSS files.
Concatenation combines several CSS or JS files into one file.
If you have WP-Rocket or W3 Total Cache installed, both features are supported.
One of the easiest ways to fix a slow WooCommerce website is to address the issue of uncompressed images.
Uncompressed images are byte heavy and can have a huge impact on your site’s load time, especially if you feature product galleries and slideshows.
An easy way to fix the problem, if you use Photoshop to resize your images, is to save your pictures using the “save for web” feature. Personally, I normally set my images to “medium”.
Furthermore, you can also use an online service like TinyPNG (they also have a WordPress plugin, but you will need to register an account and get an API key). TinyPNG will crawl through your image gallery and compress your images using a lossless compression algorithm. A simple compression can sometimes reduce the size of an image by 90%, a task well worth the effort.
Another tip to consider, when possible, is to use SVG (scalable vector graphics). SVGs are a great alternative to PNG and JPEG icons and logos. And since we are in 2018, most browsers will support them.
Plugins can make a big impact on your site’s performance.
There are over 40,000 plugins available in the WordPress repository. Most of them coded by different developers with varying skill levels. As a webmaster, it’s only too tempting to install plugins to further your site’s functionality. However, there are few things to look out for, like:
- Plugins with encrypted code.
- Plugins that communicate with a third-party server.
- A plugin that performs a lot of database queries.
- Plugins that are written with inefficient code or faulty syntax.
A handy extension that can help you narrow down slow plugins is the P3 Plugin Profiler. The plugin creates a profile of your WordPress site’s plugins’ performance by measuring their impact on your site’s load time.
As a general guide, try to keep plugins to a minimum and remove any plugins you don’t need.
A task often ignored by store administrators is to update WordPress, WooCommerce and any plugin installed on the website. By keeping installed extensions up to date, you are less likely to run legacy code and encounter conflicts between plugins. Updates will also keep your installation secure against discovered security vulnerabilities and bugs – so make sure that your site is running up to date!
WooCommerce comes installed with a bundle of CSS and JS files. Most of the files are only required to run on WooCommerce pages (cart, checkout, shop etc…), but yet, they are loaded throughout the website.
Another approach to speeding up your site is to prevent the loading of unnecessary CSS and JS files on non-WooCommerce pages. As fewer resources need to be loaded, your site may see an improvement in performance.
Consider removing the following styles and scripts by adding the code below to your functions.php file.
Finally, you can disable Cart Fragmentation on non-Woocommerce pages.
The issue with cart fragmentation is that it calls admin Ajax on every page – delaying loading time considerably and consuming high server resources.
The above steps are some of the actions you can take to fix a slow WooCommerce website. Naturally, there can be other reasons for an underperforming website – much depends on your theme and set up. If you need assistance, please don’t hesitate to get in touch and review our speed optimization service.