How To Increase Your WordPress Site Performance

Nowadays, if your website doesn’t appear on the first page of Google search results, it means you are practically invisible to your potential users. And if you want Google to love you more and bump you up, one of the most important things you need to do is improve your WP site performance. Plus, your users will be happier not to have to go for a coffee while your page is loading. 😉

Let’s see what you can do in order to optimize your website performance.

1) Website image optimization

If your website has images, it’s almost certain that they are the heaviest part of it. Usually, more than 90% of your website’s size comes from images. It makes sense to optimize them as much as you can, right? There are many techniques to do it, we created 2 plugins for WordPress and by implementing them you will increase your WP performance.  Also, you won’t believe how easy to use these tools are!

ShortPixel Image Optimizer (SPIO)

This was our first plugin, and the origin of our success 🙂 

ShortPixel Image Optimizer is an easy to use and lightweight plugin that can compress all your old images and PDF documents with a single click. In addition, new images are automatically resized/rescaled and optimized on the fly, in the background.

As an example, let’s take a random image from Unsplash. The image we link to weighs 4.45 MB with a resolution of 5184×3456. Looks like an image you would take with a regular camera. This is what happens when it gets processed by ShortPixel Image Optimizer:

After setting a Lossy compression and a maximum size of 1920px, we reduced the size by 87.52%! Now it weighs 398KB. Impressive. And the quality of the picture is almost the same. See the final result here:

If you want to check how our image optimization service performs with your images, feel free to test it with our web tool. You’ll be surprised how much we can reduce the size of the photos!

ShortPixel Adaptive Images (SPAI)

The ShortPixel Adaptive Images plugin optimizes your images like SPIO, but it includes 2 additional services: a CDN and an image resize/adaptation service. ShortPixel AI processes the original images taking into account the visitor’s viewport/placeholder, and it generates new URLs for the images, according to the user’s settings. These will be served instead of the original images. Such images will be then optimized and served from our CDN, with the appropriate size.

Let’s take the following site, for example. This is a GTmetrix (an online tool where you can check also your WP site performance) report before installing Short Pixel Adaptive Images:

And this is after installing ShortPixel Adaptive Images:

And the installation and configuration of SPAI is even simpler than SPIO’s! This is literally an install-and-forget-about-it image optimization plugin. Download it now for your WordPress site!

If you want to know more about both plugins, have a look at these documents:

– How does ShortPixel Adaptive Images compare to ShortPixel Image Optimizer?
– How does ShortPixel Adaptive Images work?
– How does ShortPixel Image Optimizer work?

What if I don’t have WordPress?

No problem, ShortPixel has got you covered. In addition to the previous two plugins, ShortPixel Image Optimizer and ShortPixel Adaptive Images, we offer the following services that take care of your images:

– A straightforward web interface to our API, available to any PHP website (Magento, Joomla, Drupal, custom brew, etc.). More information about our Website Optimizer.
– A command line tool which optimizes image folders from the command line, so it can be configured as a Cron (or other task scheduler) job. More information about our Command Line Tool.
– A reducer API, which allows you to shrink an image based on the URL of the image. You can call it from any programming language that allows you to send an HTTP POST request. More information about our Reducer API.
– A Post-Reducer API, which allows you to shrink an image that is not accessible online, by uploading it to our servers via a POST HTTP call. You can call it from any programming language that allows you to send an HTTP POST request. More information about our Post-Reducer API.
– A PHP client library which features a quick configuration and an easy fluent syntax for accessing our services. More information about our PHP client library.
– An app for Zapier, allowing you to shrink images located on Dropbox / Google Drive folders via a Zapier connected workflow. As this is still in Beta phase, you need to get an invitation from us. To know more about this, here’s additional information about the integration with Dropbox and here about Google Drive.

Must-have tools for even more optimization

Do you want to go even further? There’s still a lot of room for improvement if you are computer-savvy enough. Together with ShortPixel’s tools, have a look at how else you can improve your website image optimization.

2) Get a good hosting

It is exasperating to visit a website and to see this for more than 0.5 seconds:

That’s what happens when you get a hosting service from a company that offers hosting for $1 a month. You will be having a server that is shared between lots of other people, all of them using the same resources as you.

So perhaps it’s time to switch web hosts! But where to start looking? There are a few categories of hosting solutions, for all budgets and needs. Here we describe them and give our honest recommendations:

Shared hosting

This is the cheapest option, adequate for websites that have low traffic (around 20,000 monthly visitors) and don’t have components that require lots of resources (like WooCommerce or WPML on WordPress).

Best shared hosting providers:

• Cloudey: Very active on online forums, you will not find so many reviews, and that’s what makes them a good option; noawadays the big majority of reviews are mostly paid.
• Lightning Base: it is a less known player, and their website does not look the best, but they keep being among the best year after year.
• Incendia Web Works: small company but with very good results.
• Krystal: company based on UK, with happy clients and very good reviews in different Facebook groups and online forums.
• WebHostFace: ShortPixel was once using their services, so you cannot go wrong 😉

You should avoid any hosting provider owned by EIG, like BlueHost, HostGator. Also, stay away of GoDaddy, OVH, NameCheap, 1and1 and any other low-cost company.

If you’d like more recommendations about shared hosting, we recommend to do your own research, since each person has their needs and every hosting provider offers something different, but to start, here’s the minimum you need to look for when searching for a new shared hosting provider:

– Avoid unlimited offers: Nothing is unlimited (disk space, domains, bandwith…) in the hosting world, and if they offer you that, it means they have a very strong limit in something else.
– Enough disk space: Calculate how much your website needs (most of it will be taken by image files), and double it, so you can have enough space to make, at least, one local backup.
– Good support: make sure your hosting will be there for you 24/7 and that you can contact them via chat, email or phone. You don’t want to have your website down on a Sunday and have nobody available to help you.
– Free SSL certificates: your hosting should support Let’s Encrypt, which provides free SSL certificates, and they should be able to install it for you. This is very important not only for your users’ security, but also for better SEO, as Google doesn’t like websites that are not https.
– Backups: a good hosting should at least make backups for free. If you get a cheap plan, usually you will have to pay in order to restore a backup, but at least you will have a backup.

VPS

With a VPS you get a “part” of a server. The hosting company gives you a Virtual Private Server, allocating resources for your account, so nobody else shares them with you, unlike in shared hosting. This gives you better performance than shared hosting and it’s ideal if your business starts growing. In this category we also find two kinds of offers:

• Unmanaged VPS, cheaper but more complicated to set up. You will need some technical knowledge and sysadmin skills to configuring everything, from managing your server updates to configuring the e-mail server. However, you can
• Managed VPS, more expensive but as the name implies, managed by your provider. This is the next step to take if you have a serious business and you already tried shared hosting.

Best VPS hosting providers:

– DigitalOcean: offering unmanaged VPS hosting, if you are tech-savvy and are comfortable with managing your server, go with them.
– Linode: an excellent alternative to DigitalOcean, offering unmanaged VPS hosting too.
– Hetzner: prices almost unbeatable for unmanaged VPS, only recommended if your business is in Europe, as they are a German provider and it is known their best performance is experienced there. An excellent combination we always recommend is Hetzner+RunCloud (see below).
– Cloudways: they are probably the best option option in managed VPS hosting. In other words, you get a VPS but they manage it for you. They use other providers infrastructure (even Google Cloud’s) and add their user-friendly control panel on top, so it’s a good option for non-techies.
– RunCloud: another great option for managed VPS, offering top-notch performance. It differs from Cloudways in the sense that you need to purchase your unmanaged VPS with say, DigitalOcean, and then “connect” it to RunCloud. With Cloudways, you get only one bill.
– SpinupWP: from the creators of ACF and WP Offload Media, here’s another wonderful product by them, a cloud panel to manage your VPS. It is one of the competitors of RunCloud, offering similar prices with great performance as well.

Managed WordPress hosting

Perhaps at the same level of a VPS, the difference is that providers offering managed WordPress hosting don’t limit your hardware resources, but they do it in traffic, guaranteeing high speeds. We recommend this option if you require peace of mind, although bear in mind that they usually have a lot of restricions on what can be installed on your site. For example, you’ll see that most of them do not allow page cache plugins.

Best managed WordPress hosting:

– Kinsta: providing managed WordPress hosting, it’s one of our favorites for their ease-of-use and excellent performance.
– Closte: a bit more expensive than the rest, but in the same league as Kinsta, and with great performance too.
– Flywheel: in our experience, a bit slower than the above too, but still a great option if the others don’t suit your needs.

Dedicated server

If you find yourself in the situation where Managed WordPress Hosting or a VPS from our recommendations are not enough, then you should go with a dedicated server (or more than one). This means a whole server for your site, that won’t guarantee the best speed if the server is not purchased from a good provider, but if it is, you’ll have top-notch performance.

Dedicated servers have to be administered by someone, and the performance you can get from them will depend on how well that’s done and the actual hardware resources from the server. Because of this, we recommend you to seek for professional advice. Anyway you will need it if your business is that successful 😉

3) Use as few plugins as possible

This situation is very similar to a recently purchased phone or laptop. They come with a lot of software you don’t use and that makes the device slower. On WordPress, when installing lots of plugins, the same happens.

Try to keep the list of plugins as small as possible; only use the necessary ones otherwise you will affect your WP performance. Here’s what you can do in order to clean your WordPress installation:

– In general, check out each plugin and ask yourself if you need it. If you don’t, remove it. Don’t keep it “just in case”. For example, do you have a plugin that adds a cool effect to the titles of the admin area? Not needed.
– Do you have two plugins that do the same task? Get rid of one. For instance, something we usually see – two cache plugins. It doesn’t make sense; caching twice your pages doesn’t have any benefit.
– Do you use a huge plugin just for a single feature that’s included in that plugin? Try to look for a smaller plugin the purpose of which is exactly that feature you want, or you can even look for the piece of code you need on Google.

Remember that the goal is to reduce the number of plugins so WordPress doesn’t need to load too much stuff.

4) Use good WP plugins to keep up the performance

A single badly-coded plugin can ruin your whole website and make it very heavy. In order to choose the best plugin for each necessity, have this checklist close by, and over time, you’ll be able to detect easily which plugins are the best in each category:

– Last updated: If a plugin hasn’t received any update in the last 6 months, this usually means it’s outdated, and will probably have functionality or compatibility issues, even security issues. Our advice is to avoid outdated plugins unless you know they are safe to use.
– Active installations: Usually, the more a plugin is used, the better service/product is offering. Otherwise people would not use it 😉
– Compatible with the latest WordPress version: If the plugin indicates that is compatible with the latest WordPress version, it usually means that the developer took some time to test the plugin against the most recent version of WordPress.
– Screenshots: This is one of these things that show whether the developer cares about the users or not, since some good screenshots will help them see if the plugin will fit their needs or not.
– Good description: It’s fundamental to have a good description to know what the plugin does and how it does it. If you find yourself needing to install it to check how it works, it’s not a good sign.
– FAQ: It comes with screenshots. It shows that the developer wants you to understand how the plugin works.
– Average rating: Obvious, but make sure to match it with the number of reviews, because a plugin with a single 5-star rating doesn’t mean it will be better than another with 34 4-star ratings. That single 5-star rating will probably be from the author…
– Support: You’ll want to have a good support in case things go wrong. Check if the plugin or extension has some public place where you can see the questions and answers. For example, WordPress has the public support forums. Another thing that we recommend is to try to contact the plugin author(s) directly and ask them a simple question. The aim here is not the answer itself but how the support is handling your question.
– Developer profile: More nerd-oriented 😉 but it’s nice to see who is the developer, what they do… It gives you a more personal feeling about the plugin.

5) Use a CDN

CDN stands for Content Delivery Network. What a CDN does is basically duplicate your website’s resources across a network of servers around the world. That means that your website in your server’s country will load as fast as it would load for somebody in the other side of the world. This is a MUST WP performance setup if your visitors are all over the world.

Here’s a quick list of the most famous CDNs out there:

– Amazon CloudFront: here’s the CDN offered by Amazon Web Services. If you use the Internet (and if you are reading us, you do), you are probably using them, as companies such as Spotify, Slack or Hulu use Amazon CloudFront.
– Cloudflare: it operates one of the most efficient DNS services in the world, and they also offer DNS servers since not so long ago: 1.1.1.1. They usually partner up with hosting providers like SiteGround, so you’ll have a very deep integration.
– KeyCDN: they offer very low prices, and even though you won’t get the biggest network, they are usually partnering up with hosting companies, so it is very easy to set up.
– StackPath: guess who uses StackPath? ShortPixel! The CDN that SPAI is using is based on StackPath, so if you want to check out where our CDN has points of presence, have a look at this page: https://www.stackpath.com/platform/network/

6) Make use of the available caching services

Between the user and the server you may have several caching services available and you didn’t even know it!

– Page caching: depending on the technology your website is using, you may have available some page caching plugins or extensions. These will generate HTML files in the server’s hard disk or memory, and will serve them whenever a request is made instead of executing PHP code and MySQL database queries. On WordPress, for example, you got these (they are not all of them, remember that WordPress has more than 50,000 plugins!):

• Swift Performance
• LiteSpeed Cache
• WP Rocket

– Hosting: some hosting providers offer you caching features under different names. For example, Siteground offers their Supercacher feature, which is simply another caching method on a server level. Make sure you review all your hosting features you have available and take advantage of them!
– CDN: a third layer of cache. Each CDN provider will offer you (or not) a caching feature, which actually makes sense coming from a CDN. Cloudflare, for instance, offers you a cache option which you can enable or disable. We suggest that you go to your CDN control panel and review all its settings and features; you will probably find a caching method for free.

7) Update your PHP version

If you use PHP, and you do if you are using WordPress, make sure you use the latest version of it. You will definitely notice the loading speed increase, especially if you upgrade from PHP 5.6 to PHP 8.X. Kinsta ran some benchmarks and the results are clear. The latest version of PHP is the clear winner.

However, updating the PHP version, instead of increasing your WP performance might cause some problems on your website, as it is a sensitive part. Be sure to test extensively all parts of your site after updating the PHP version, and have an easy way to rollback too. To help you with this, you can try a sandbox WordPress system, where you can test plugins and/or themes without fear of breaking something. They probably won’t have the latest PHP version, but at least an “almost latest” one. Here’s a free sandbox system you can use:

– Sandboxwordpress.com

8) Optimize your code

There are several ways to optimize the code of your website, such as…

Reduce HTTP requests

Every time a web page is loading, there are a number of HTTP requests and responses between the client (your browser) and the server. The more requests are done, the more time the page will take to load. To reduce this number of requests, you can do several things:

– Use less code 😉
– Use CSS sprites.
– Inline your Javascript (but only if it’s very small!)
– Combine your CSS and Javascript files (if you don’t use HTTP/2).
– Use less plugins/extensions that will add more load to the page (see above, section 3).

Depending on the CMS you use (if you use one), you’ll have available some plugins or extensions that will help you achieve the results we are looking for. For instance, on WordPress, you have available the Autoptimize plugin, which can help you inline and combine your CSS and Javascript files.

Minify the code

What does minify mean? Basically, removing any unnecessary character from your HTML, CSS or Javascript files. What are unnecessary characters?

– New line characters
– White space characters
– Comments

A minified code will usually look like this:

As you can see, there are no new lines, comments or unnecessary white space characters.

For WordPress, Autoptimize is again a good plugin to use for this purpose and it might increase your WP performance as well. But it will be even better if the minification is done by your CDN, so your server doesn’t need to bother with it. Give it a try!

9) Defer JavaScript execution

The huge majority of websites are basically a mix of:

• HTML
• CSS
• JavaScript

While your HTML and CSS add the content to your site, structure it and style it, JavaScript is in charge (but not only) of making that interactive. JavaScript controls the behavior of different elements of your site. Among everything you can do with JavaScript, you have:

• Live searches
• Analytics
• Element animations, like images or sliders
• Pop-ups
• Data dynamic handling
• Chatboxes
• etc.

As you may notice from the list, what JavaScript offers hardly ever needs to be prioritized on page loading. Our goal should be to present to the user a nice website as soon as possible, and load the extra functionality as late as possible, so we increase the perceived loading time.

There are two main ways you can defer the JavaScript execution:

1. Adding the “async” attribute to your JS scripts
2. Adding the “defer” attribute to your JS scripts

This visual explanation from Growing with the Web is an excellent way to understand the differences.

In short, take these things into account:

• Do not defer anything that affects the content above the fold.
• Defer may give you better perceived loading time, but may break more things.
• “Async” is safer
• Unless you know what you are doing, do not touch the script “jquery.js“.
• Test your site extensively!

How to defer JS scripts?

Async JavaScript

A free and probably the best way to do it is with the plugin Async JavaScript, from the same person that brought Autoptimize. Simply install it, go to Settings > Async JavaScript, and at the top you will be able to enable or disable “defer” or “async”.

If you scroll down, you’ll see a few more fields if you want more granular control, in case you want to include or exclude some scripts, plugins or themes (you’ll need this).

Cache/Optimization plugins

Another option will be to use your favorite cache plugin, like WP Rocket or Asset CleanUp. Usually they include some option to do this.

For instance, WP Rocket can help you defer the execution of JavaScript in the section File Optimization of the WP Rocket settings. Look for the Load JavaScript deferred option.

Add a code snippet in functions.php

There’s always a way to do things via the functions.php file, right? Here too. Add the following code to your functions.php file:

function defer_parsing_of_js( $url ) {
    if ( is_user_logged_in() ) return $url; //don't break WP Admin
    if ( FALSE === strpos( $url, '.js' ) ) return $url;
    if ( strpos( $url, 'jquery.js' ) ) return $url;
    return str_replace( ' src', ' defer src', $url );
}
add_filter( 'script_loader_tag', 'defer_parsing_of_js', 10 );

What this does is, basically, telling WordPress to add the “defer” attribute to all your JavaScript files except jQuery.js. Obviously this will not be as flexible as Async JavaScript or other plugins, but it will be more efficient in terms of speed. Try it and if you don’t find any issue, stay with it!

10) Optimize your database

Optimizing your database is also essential. Perhaps you won’t notice it if your website is a small one, but if you have had it for quite a while and/or you have a big website, you will probably see and feel a difference once you clean your database.

Every environment and setup is different, so there’s no “magic code” that will do this for you. However, we can give you some tips regarding the most popular database, MySQL. WordPress uses it too.

If you use phpMyAdmin, you can optimize your databases with a click. This can be time-consuming depending on the size of the data and indexes, but unless there is a power outage, running this does not harm the data. This process is similar to defragmentating a computer. To do it, follow these instructions:

1) Log into your phpMyAdmin. If you don’t how, your hosting provider will be able to help you.

2) Click on Databases at the top
3) Select the relevant database
4) Click on Check All (unless you want to target a specific group of tables) and then select Optimize table
5) You should receive a confirmation message. You are done!

If you don’t want to get your hands dirty when using WordPress, there are many plugins that will help you do this. For instance: WP Clean Up Optimizer

11) Compress your code to increase your site performance

Yes! In the same way you can compress some files on your computer, web pages can be compressed too! Why would one do that? Easy, to save bandwidth and speed up your website. As they show on Pingdom (they are experts in web performance), you can easily reduce the size of your website by more than 75%.

On WordPress, there are multiple plugins that will help you do that increase of WP performance, usually with a single click, such as WP Fastest Cache or Enable Gzip Compression.

If you don’t have WordPress or any other CMS that accepts plugins or extensions that will do this for you, you’ll probably have to configure your server. For example, on Apache, it’s as easy as adding the following code on your .htaccess file:

# compress text, html, javascript, css, xml:
AddOutputFilterByType DEFLATE text/plain
AddOutputFilterByType DEFLATE text/html
AddOutputFilterByType DEFLATE text/xml
AddOutputFilterByType DEFLATE text/css
AddOutputFilterByType DEFLATE application/xml
AddOutputFilterByType DEFLATE application/xhtml+xml
AddOutputFilterByType DEFLATE application/rss+xml
AddOutputFilterByType DEFLATE application/javascript
AddOutputFilterByType DEFLATE application/x-javascript

# Or, compress certain file types by extension:
<files *.html>
SetOutputFilter DEFLATE
</files>

You should note that some older browsers may have trouble with Gzip compression. Take this into account if your website is visited by these older browsers.

Brotli has lately come on the scene as a better alternative to Gzip. It is less supported by the hosting providers, but if you have it available, do use it. Cloudflare supports it too!

12) Use HTTP/2

HTTP stands for HyperText Transfer Protocol. As a protocol, it defines how the client (your browser, for instance) and the server should communicate with each other.

HTTP/2 is the most recent stable version of this famous protocol. HTTP/2 brought many improvements and very important for the website performance, and probably the most important one is multiplexing. HTTP/1.1 (the previous version) was loading resources one after the other, so if one resource couldn’t be loaded, it could block all the other resources behind it. In contrast, HTTP/2 is able to use a single TCP connection to send multiple resources at once so that no resource blocks any other. This is very important in the modern days, where more and more resources are being loaded when the page load (JavaScript files, CSS files, fonts, etc.).

HTTP/2 should be enabled on both client and the server. Fortunately, you don’t need to worry about the client, because all browsers already support HTTP/2. You should then focus on the server, your server.

How to activate HTTP/2

First, check your site on this tool. If you use HTTP/2, you are good to go.

If you are not using HTTP/2 yet, and if somebody else is managing your server (shared hosting, managed VPS…), just ask your hosting provider if they can do this for you. If they can’t, it’s time to switch 😉

If you are the responsible for managing your server, the steps will change depending on what server you use.

• If you use NGINX, KeyCDN have a nice tutorial for you.
• If you use Apache, check this tutorial out.

13) Analyze your website speed optimization

Lastly, we have the famous website performance test tools which is perfect for a WP site performance test. These are websites that analyze other websites (yours) and give you a very extensive report about how your website can improve its speed. Let’s check one of the most notorious ones: GTmetrix.

1) Enter your URL in the big box:
2) Now wait until the analysis is done…
3) And now you will be presented with a report. Usually, as you can see here, you will be given a score and then some recommendations to improve your webpage performance.

All these tools work in the same way. Here’s a small list:

– GTmetrix
– PageSpeed Insights
– Pingdom Tools
– WebPageTest

As a side note, don’t get obsessed with them and try to go always for the maximum score possible. They are great tools, but you need to take them as a reference. For example, let’s say you got this:

The effort and time used to pass from 99 to 100 will not be worth it; your website won’t load noticeably faster and you won’t get better SEO rankings.

To learn more about this, have a look at what we have to say about GTmetrix, PageSpeed Insights and other website speed testers.

Extra ball: Monitor your WordPress site performance

For those of you who like to be picky and want their WordPress website to load as fast as possible, it may be a good idea to do some profiling if you are technical enough.

Profiling is the process of analyzing the execution of an application, measuring the frequency and duration of function calls, memory consumption and more. It helps you figure out where exactly is the bottleneck in your application, in this case, WordPress.

As a starting point, the WordPress Codex has a short tutorial on how to do this. If you are not a WordPress developer, that may seem difficult, so even though it may sound ironic to fix a plugin or script with another plugin, you can give Query Monitor a try to handle your WP performance.

Query Monitor is a pretty famous plugin which shows you all the queries happening on a page and much more, such as PHP errors presented with their responsible component, enqueued scripts and style-sheets or HTTP API requests.

For example, here you can see on a test site how many queries happened and by what component:

At the moment of writing this article, Query Monitor has 304 5-star reviews out of 312. It must be good, right? 😉

We hope this article helps you improve your WP performance so it experiences the boost it deserves!

Image 1 by Jonathan Peterson from Pexels