It doesn’t matter how amazing your website is – if it takes too long to load, your visitors will punish you for it by leaving. It’s not a stretch to say an extra second or two of loading times can mean the difference between a successful website and a failed project.

There are a lot of ways to speed up WordPress. However, using a tool such as Google PageSpeed Insights will enable you to zero in on the most effective methods. If you can get a perfect Google PageSpeed score, your website should be blazingly fast and a joy to use.

In this article, we’re going to talk about why WordPress performance is essential and how Google PageSpeed Insights works. Then we’ll teach you how to improve your PageSpeed score, which is another way of saying we’ll improve your WordPress performance. Let’s take a look under the hood!

Why WordPress’ Performance Is Critical to Your Website’s Success

An example of a loading time test for a website.

Generally speaking, anything below two seconds is a decent loading time.

When we talk about WordPress’ performance, we’re referring to how long it takes – on average – for your website to load. In the example at the start of this section, we tested how long it takes for wordpress.org to load from a New York server. Generally speaking, anything below two seconds is good enough. If your website loads in under one second, though, you’re well ahead of the curve.

When loading times start creeping above the two-second mark, your bounce rate usually goes up accordingly. This is only one of the cons of shoddy performance, though. Let’s talk about some of the others:

  • It affects user experience. If using your website feels like a struggle due to how slow it is, chances are your visitors won’t enjoy the experience.
  • Bad performance can affect your SEO. Loading times are one of the factors Google takes into account when it ranks your website.
  • It makes your website feel unprofessional. There’s no excuse for a popular site to be poorly optimized when there are so many ways to improve its speeds.

One of the main problems when it comes to slow websites is people don’t notice there’s an issue in the first place. It might be you’re used to how long your site takes to load, so you don’t realize you can improve those times if you work on it.

With this in mind, your first move should be to use a speed testing tool to gauge your website’s performance. After all, without any numbers in hand, it’s difficult to know if there’s a problem you need to address.

What Google PageSpeed Insights Is (And How to Interpret Its Scores)

The Google PageSpeed Insights homepage.

Google PageSpeed Insights isn’t a speed testing tool per se, despite its name. While the tool does provide you with some information related to loading times, it’s more focused on breaking down how you can improve overall performance.

To use it, simply type a URL into the empty field you can see in the image at the beginning of this section. Click on the Analyze button, then let Google work its magic for a few seconds. Once the result screen loads, you’ll see two score boxes, so to speak – one for your website’s Speed and another for its Optimization:

Two examples of speed and optmization scores.

The Speed result includes two numbers – First Contentful Paint (FCP) and DOM Content Loaded (DCL). FCP stands for how long it takes for someone to see a visual response from the page they’re trying to load. DCL time, on the other hand, refers to the time it takes for your page’s full HTML content to load, without any interfering Cascading Stylesheets (CSS) or JavaScript, but without counting images. To put it another way, DCL practically translates to your full loading time, so it’s important to keep this metric down. On top of displaying your speed averages, PageSpeed Insights also breaks down their averages:

An example of how PageSpeed Insights shows loading time averages.

In the example above, 36% of page loads took less than 1.6 seconds, whereas 43% took between 1.6–3 seconds. It sounds complicated, but this graph represents the fact not everyone will load your website at the same speeds.

Moving on, there’s also the Optimization score, which is the one we’re interested in for this guide. PageSpeed Insights provides each page with a score ranging from zero to 100. If your website has a perfect 100 score, it means all of the technical optimizations Google takes into consideration when evaluating it are implemented. Those optimizations, of course, also result in lower loading times, so they’re worth the effort. In the previous example, the website we tested received a 73 Optimization score on mobile, but an 84 if you switch to the Desktop results tab:

Two examples of PageSpeed Insights desktop scores.

If you scroll further down on either tab, you’ll see a list of Optimization Suggestions you can (and should) implement to improve your overall score:

Some tips on how to improve WordPress slow loading pages.

Theoretically, you should be able to achieve a perfect Google PageSpeed score if you implement all the fixes the service tells you to. In the next section, we’ll break down how to implement each method, and thus improve your loading times.

How to Speed Up WordPress and Improve Your Google PageSpeed Score (In 6 Ways)

Keep in mind – these 6 methods aren’t the only ways you can improve WordPress’ performance. However, they’re the factors Google feels are the most important. In any case, if you implement all six fixes in this section, your website’s loading times should improve dramatically.

1. Minify Your HTML, CSS, and JavaScript

When we write code, we tend to add a lot of unnecessary characters from a computer’s perspective. For example, new lines and white spaces aren’t necessary to understand your code, but serves as a cosmetic enhancement for us. Minification refers to the process of removing all those unnecessary characters from your files, which in this case, includes HTML, CSS, and JavaScript.

Minifying your scripts and files doesn’t affect their functionality in any way, but does enable you to shave down their filesize, resulting in faster loading times. You can do this process by hand, but the smart move is to use a tool that takes your scripts and minifies them for you. In this case, we’ll use the Fast Velocity Minify plugin since it requires the least configuration to get up and running.

The Fast Velocity Minify plugin.

To use the plugin, do the following:

  1. Go to the Plugins Add New page within WordPress, and use the search bar to look for it using its name.
  2. When the plugin shows up among the results underneath, click the Install Now button.
  3. After a few seconds, click on the Activate button and that’s it – the plugin is up and running!

As soon as you activate the plugin, it’ll automatically start minifying your HTML, CSS, and JavaScript files for each visitor who attempts to access your website. However, the plugin also offers a set of more advanced settings you can check out if you want to improve your website’s performance even further.

If you’re not a fan of Fast Velocity Minify, there are other plugin solutions you can use on your site. Some other top solutions include Merge + Minify + Refresh and Autoptimize.

2. Optimize Your Above-the-Fold Content

When we talk about ‘above-the-fold’ content, we’re referring to the elements of a page that show up as soon as it loads, without you needing to scroll down any further. For example, here’s a screenshot of 000Webhost’s above-the-fold content:

An example of 000Webhost homepage's above the fold content.

In some cases, the CSS and JavaScript you include in your website can slow down the process of rendering above-the-fold content. This happens because your browser needs to process those scripts before it can start the rendering process.

Dealing with render-blocking scripts for above-the-fold content can help improve your DCL times, which as you might remember, are one of the metrics PageSpeed Insights measures.

Fortunately for you, we’ve previously dedicated an entire guide to optimizing your above-the-fold content. Check it out and when you’re done implementing the fixes within, move on to method number four.

3. Leverage Browser Caching

Often, when you visit a website multiple times, you’re not reloading it in full on each visit. In the background, your browser saves some of the website’s files locally, so you don’t have to load them again. This process is called ‘browser caching’, and it simply enables you to navigate through your favorite websites faster.

The problem is, not all websites are configured to take advantage of – or leverage – browser caching, which can result in slower than average loading times.

If you’re a 000Webhost user, you don’t need to worry about configuring your website to leverage browser caching since we already take care of that for you. We do this by using a custom .htaccess file for all our users, which includes a few performance tweaks, including advanced caching configurations.

A copy of a 000Webhost .htaccess file.

On the other hand, if you’re using another host, you can quickly optimize the way your website deals with caching by making a few tweaks to your .htaccess file or through a plugin. In any case, we cover how to tackle both methods in this guide, so be sure to check it out.

4. Optimize Your Website’s Images

In most cases, you’ll want to use images with only the best quality on your website. The problem is, high-definition photos take up more filespace, which translates to longer loading times.

Fortunately, there are tools you can use to compress your images or optimize them. Depending on your choice, you can optimize your images using lossy or lossless processes. Lossy optimization results in smaller pictures, albeit they might lose a bit of their quality in the process (usually not enough to be noticeable). Lossless optimization, on the other hand, compresses your images as much as possible without affecting their quality.

In most cases, you’ll want to use lossy optimization techniques since the difference is hardly noticeable and the resulting performance increases are better. If you don’t use a lot of images on your website, you can use a manual optimization tool, such as TinyPNG, which requires you to upload and download each image by hand:

The TinyPNG homepage.

Since we’re WordPress users, though, it makes more sense to automate the process using a plugin. There’s a plugin version of TinyPNG we can use in this case, called Compress JPEG and PNG Images:

The Compress JPEG and PNG plugin.

To use the plugin, you’ll need to install and activate it, as usual. Afterward, you’ll need to register for a free TinyPNG account to get an API key, which enables the plugin to automate the image optimization process. To do this, go to the Settings > Media tab and look for the TinyPNG Account section:

Configuring the Compress JPEG and PNG plugin.

After connecting the plugin with your TinyPNG account, it’ll proceed to optimize all images in your library as well as any new ones you upload. If you’re not a fan of the Compress JPEG and PNG Images plugin, there are other tools you can use, such Smush Image Compression and Optimization or EWWW Image Optimizer.

5. Avoid Landing Page Redirects

When you visit a website and it sends you to a different page, it’s called a ‘redirect’. There are several situations where using redirects makes sense. For example, if you set up a mobile version of your website and someone on a smartphone visits the regular version, you might redirect them to the former, such as 000webhost.com > m.000webhost.com.

Technically, this approach works, but it’s not optimal. The far better option is to create a website that’s fully responsive from the ground up. This means you can avoid redirects, which ends up positively impacting your performance since all of the unnecessary ‘hoops’ to jump through, so to speak, are removed.

Another situation where using redirects makes sense is if you change your website’s domain, which isn’t something common. In any case, your goal should be to use redirects as sparingly as possible. The easiest way to do this is to use a fully responsive WordPress theme, removing the need to create an alternate mobile version of your website.

Hestia theme

Fortunately, most modern WordPress themes fit the bill. If you’re currently using an unresponsive theme, we recommend updating to one of our recommended options and look into redesigning your entire website. It can take some time, but it’s a process that’ll save you a lot of headaches down the road.

6. Improve Your Server Response Time

Each time you try to access a website, several things happen in the background. First off, your browser sends a query to the site’s server and it waits for a response. How long your server takes to respond affects your overall loading times.

Ideally, your server response time should be well below one second. However, in practice, several factors can affect response times. Let’s break down what they are:

  • Your server’s hardware. The better the underlying hardware is, the more requests your server should be able to handle simultaneously.
  • How much traffic your server is dealing with. The more simultaneous users your site receives, the more strain your server will be under, which can affect its response times.
  • The distance between your visitors and your server. How far away you are from the server you’re trying to connect with can impact response times.

These days, distance doesn’t play as much of a role when it comes to server response times since internet connections are, on average, faster than ever. The main factor when it comes to this metric is usually your web hosting provider. To put it simply, not all providers are made equal, and some offer faster services than others. If you’ve already implemented all the fixes in this tutorial and you still see slow loading times, chances are your web host is bottlenecking you. In that case, your best bet is to upgrade to a better service, such as Hostinger.

The Hostinger homepage.

Of course, it might also be that you’ve outgrown your current hosting plan. Shared hosting, for example, usually can’t handle websites with a ton of traffic without performance drops. In this case, you’ll want to look into upgrading your plan to something such as a Virtual Private Server (VPS). These plans tend to be a bit more expensive, but you can find decent VPS options starting at around $5 per month if you look around.

Conclusion

Tackling your WordPress performance issues takes work. After all, most websites aren’t perfectly optimized out of the box. However, if you’re willing to sit down and make a few improvements, your site’s performance should improve in no time. Moreover, if you choose the right web host from the get-go, you’ll need to do a lot less work to speed up WordPress down the road.

If you’re a 000Webhost or Hostinger user, you don’t have to worry about leveraging browser caching or server response times, for example. You’ll still need to optimize your images and enable GZIP compression, among other things, though. However, that’s par for the course when it comes to running a WordPress website.

Do you have any questions about how to improve your Google PageSpeed score? Let’s talk about them in the comments section below!

1 Comment

  1. Jebin Carlos

    Very Nice Brief , Its help me a lot.

    Reply

Submit a Comment

Your email address will not be published. Required fields are marked *

This site uses Akismet to reduce spam. Learn how your comment data is processed.

  • php
  • my sql
  • intel
  • cloudlinux
  • nginx
  • cloudflare
  • wordpress