If you’ve been reading our blog posts, you’ve probably already noticed that page load speed is one of the key factors for a successful website. In the case of loading an online shop, speed is even more important, as fast online shops make better sales.

Here’s how to successfully speed up your WordPress-based WooCoomerce webshop in nine steps.

1. Use only the necessary plugins

The first step is to use only the plugins that your store really needs to function. If a plugin won’t significantly improve performance or user experience, then it’s not worth using. Not only do fewer plugins make your page load faster, but it’s also easier to maintain.

It is often the case that WordPress store owners use multiple plugins that perform the same tasks. It is particularly unrecommendable to have several caching plugins loaded on one WordPress system. Multiple plugins of this kind do not help the page to load faster, but only slow it down, and in some cases conflicts can even lead to certain elements in the webshop not working.

So check that you are not using multiple plugins that do the same task. When deactivating active plugins, be careful not to remove plugins that are essential for the functioning of your webshop. However, the rule is: less is more.

WooCoommerce uses its own filters and product finders, and using a dedicated plugin can result in a database query every time you search for a product, which can significantly increase the time it takes to load your store.

2. Setting the number of products displayed

If you sell more than 20 products, it is recommended that you set how many products should appear on each sub-page. It is recommended to display between 15 and 20 products, especially on the home page of the shop.

In case your graphic template does not allow easy settings, add the code below in functions.php:

// Change the Number of WooCommerce Products Displayed Per Page 
add_filter( 'loop_shop_per_page', 'lw_loop_shop_per_page', 30 ); 

function lw_loop_shop_per_page( $products ) { 
$products = 12; 
return $products; 
}

Replace the value 12 with a value of your choice.

If the above code does not work in your case, try the following code:

// Change the Number of WooCommerce Products Displayed Per Page 
add_filter( 'loop_shop_per_page', create_function( '$products', 'return 12;' ), 30 );

Avoid external JavaScript

If you use plugins that use external JavaScript, the webshop will run slower because it will have to wait for the external server where the JavaScript is loaded to respond. Therefore, uninstall plugins that you do not need.

The next step is to delay the loading of the JavaScript. This is easily solved with the Async JavaScript or Flying Scripts plug-in.

Additionally, you can disable the script that checks the contents of the WooCommerce shopping cart, which performs its function regardless of whether the user has products in the shopping cart or not. You can disable this script with the command:

Disable wc-ajax=get_refreshed_fragments

This command is activated by the Disable Cart Fragments plugin and will not affect visitors who already have products in their cart. You can read more about this command in the blog post Speeding up WooCommerce: wc-ajax=get_refreshed_fragments.

4. Use the page preload plugin

While this option does not speed up the website, it does give the user the appearance of a faster page. This is because a dedicated plug-in causes the selected page to be preloaded for the user. This feature comes into play if you have several products on the page and there is a chance that the visitor will look not only at the first page, but also at the second and all subsequent subpages with your products.

However, be careful, in the settings, set Limit the requests to 1 per second and do it only on hover, otherwise if you have more than 5 visitors on the page at the same time, you will put a significant load on the server, which will slow down your store.

5. Choose a fast graphic template and page builder

The only scenario worse than an online shop using 50 plugins is using a slow graphic template built with a slow page builder. This is because plugins can be easily removed or replaced, and changing the graphic template is a much more difficult process if you don’t want to build a store from scratch.

The same applies to page builders. When choosing a graphic template, pay attention to which builder the store is made with. Check the user reviews and analyses of the chosen builder before you decide on it.

6. Optimise photos

Photos are one of the elements that slow down online shops the most. Of course, it’s important to keep photos as high quality as possible, but using tools like tinypng and kraken, you can reduce their size without reducing their quality.

Make sure that the size of each photo does not exceed 500 KB, and in most cases the image does not need to exceed 2000 px (height or width).

When uploading images, always use the minimum size recommended by the chosen graphic template. For example, if the recommended size for a particular product in a shop is 1200 x 800 px, use that size and no larger.

Use squoosh.app or one of the tools mentioned above to process your images accordingly.

If you are already using non-optimised images in your webshop, you can subsequently optimise them using the reSmush.it plugin.

7. Use a CDN

It is important that your website is hosted on a server that is in the country where most of your visitors come from. If they come from different countries, use a CDN (Content Delivery Network) service. This allows you to show your visitors the webshop at the same time, regardless of their location.

A CDN is a network made up of servers located all over the world. Each of the servers stores a static part of the page, which includes CSS, images and JavaScript. Using a CDN, a user is therefore uploaded a static part of a page from the server closest to the user. This will also make the server where your page is loaded work faster. To use a CDN service, we recommend the paid-for service KeyCDN or BunnyCDN.

8. Use a caching plugin

If the webshop does not use caching, it will be displayed to the user after five steps:

1. The user visits the WordPress site and the HTTP server uses the PHP module to process the WordPress PHP files.
2. PHP accesses the MySQL database where all the website data is stored.
3. From the data, PHP generates HTML files.
4. The HTML files are then forwarded to the user by the HTTP server.
5. The web browser, given the HTTP files, the CSS/JS requests and the image files requested in the HTML document, displays the page to the user.

If you use the caching plugin, you get rid of the redundant steps, as only three more are needed to display the store:

1. The user visits the page.
2. The dedicated plugin loads all the cached elements of the web page.
3. The web browser displays the page to the user.

Many caching plug-ins are available. Some of the most popular are WP Super Cache, W3 Total Cache, WP Rocket and others.

9. Use appropriate hosting

Last but not least, where your website is hosted is also important. At NEOSERV, we offer hosting on state-of-the-art servers that use powerful processors, super-fast SSDs and sufficient working memory. We offer a variety of packages and if you don’t know which one to choose for your store, we’ll be happy to advise you on the right one.

In case you’re still in doubt about why you should choose NEOSERV to host your WooCommerce online store, we invite you to read on for 12 more reasons why you should choose us.

Conclusion

If you’ve followed all the tips above, it’s time to check how fast your online store is loading now. Use one of PageSpeed Insights, GTmetrix, WebPageTestor Pingdom Tools. You can improve your score even further by following the tips offered by these tools. However, be careful not to degrade the user experience when making changes to the page.