GTmetrix Performance Blog

News, updates and guides on GTmetrix and general web performance

WordPress Optimization Guide

Running WordPress? Here’s a step-by-step guide on optimizing your WordPress installation.



Affiliate notice: You may find affiliate links to recommended products below – If you decide to purchase them through the links provided, we may be paid a commission at no extra cost to you.

 

Overview

With a lot of great plugins and themes available, WordPress makes it easy to create a full-featured website with a lot of functionality.

However, it’s easy for your WordPress install to get bloated and unoptimized, hurting your site’s performance.

In this guide, we’ve listed some free plugins and written some recommendations for our WordPress users seeking optimization help.
 

Note: This guide mainly addresses front-end optimization issues only

If your site still suffers from performance issues after following this guide, better hosting or back-end code optimization is what will likely make a real difference. Read our hosting for WordPress websites article for more details.

 


 

Step 1) Test Your Page With GTmetrix

Before undertaking any optimizations, test your page on GTmetrix.com to establish a performance benchmark.
 

Login and analyze your site on gtmetrix.com to keep track of your performance.

 
We recommend logging in (or creating a free account if you haven’t done so already) to analyze your site with GTmetrix as you’ll be able to keep better track of your website performance with Daily monitoring and History Graphs.

It’s also worth re-analyzing your page on GTmetrix after each optimization step so that you can see which items are big wins, and which steps possibly make things worse.
 


 

Step 2) Backup Your WordPress Installation

It’s critical that you backup your WordPress installation before optimization and it’s generally a good practice to back up on a regular basis as well.

You can use any of the available backup plugins offered on WordPress, but in this guide we’ll be showing you how to use UpdraftPlus to backup your entire WordPress install, including your database, plugins, themes, uploads, and more.

Follow the instructions below to activate UpdraftPlus and backup your WordPress installation:
 


 

a) Download, Install and Activate UpdraftPlus

In the “Plugins” section of your WordPress install, search for UpdraftPlus.

Download, install and activate the plugin.
 

Click on “Activate” to activate the plugin on your WordPress site.

 


 

b) Backup Your WordPress Installation

Now that UpdraftPlus is installed and activated, you can proceed to start backing up your WordPress installation.

1) Open your UpdraftPlus settings

Under the “Settings” section on your WordPress sidebar, you’ll have access to a new menu option called “UpdraftPlus Backups”. Click on the option to open the plugin settings.
 

You’ll find the “UpdraftPlus Backups” option in your WordPress settings.

 

2) Click on “Backup Now”
 

Click on “Backup Now” to backup your entire WordPress install.

 
A popup will appear. Ensure that both the “Include your database in the backup” and “Include your files in the backup” options are checked.
 
Check both the above options and click on “Backup Now”.

 
Click “Backup Now” – UpdraftPlus will create a complete backup of your WordPress installation.

If anything goes wrong with the optimization, or if your installation gets hacked or corrupted – you can restore it using your backups. More details here.
 


 

Step 3) Remove any Unwanted or Unused Plugins

It’s common to install many plugins over the course of your WordPress website usage. Some plugins provide critical features, others may have only been used for a short period, and truthfully – a few may be sticking around and you don’t even remember why! (It happens to the best of us).

That’s why it’s important to conduct a plugin audit – review your website’s plugin usage and remove the ones that aren’t needed or used anymore.
 

Look familiar? Be sure to audit your WordPress plugins and deactivate, delete and update your plugins.

 
Deactivating plugins reduces your page requests and total page size, and is often one of the best ways to improve your WordPress site’s performance.

You should note though in some cases, simply deactivating your plugin isn’t enough. Even though a deactivated plugin doesn’t load requests anymore, it may still result in a bloated database and can introduce security risks.

Hence, the recommended practice is to delete unwanted plugins completely if you don’t need them anymore.

We also recommend updating all your plugins as they may contain performance enhancements and/or security fixes, among other improvements.
 


 

Step 4) Optimize Images

Image optimization is an important, and in many cases, high-impact task in your WordPress optimization workflow, helping with the Efficiently encode images audit, and reducing your overall total page size.

There are many plugin options for WordPress image optimization.

We’ll focus on the more popular Smush plugin to optimize every image uploaded in your Media Library (and every image uploaded going forward).

Follow the instructions below to optimize your images using Smush:
 
 
1) Download, install, and activate Smush

The procedure to do this is the same as with the other plugins. Once you’ve activated the plugin, you’ll have access to a new menu option called “Smush” on your WordPress sidebar.
 

Once activated, you should see the Smush menu option on your sidebar.

 

2) Open the Bulk Smush settings

Hover over the Smush menu option, and you’ll see a list of sub-menu options; click on “Bulk Smush”.
 

Hover over the Smush menu option and click on “Bulk Smush”.

 

3) Scroll down and enable the following settings
 

Bulk Smush Settings.

 

  • Image Sizes
    • Select All to optimize every image in your Media Library, including ones generated by WordPress.
    • Select Custom if you want to optimize certain image sizes. If selected, select the sizes you wish to optimize.
       
  • Automatic compression
    • Enable the “Automatically compress my images on upload.”
    • This ensures any new images that are uploaded to your Media Library will automatically be optimized.
       
  • Metadata
    • Enable the “Strip my image metadata”.
    • This removes the extra data stored from your images like camera settings, colour profile, EXIF data, etc.
    • Do not enable this if your images rely on colour profiles to display in your preferred colours.

 
Click on “Save Changes” once you’re done.
 

We’re primarily focusing on image compression with Smush

Smush also offers an image resizing feature, which resizes your images to fit the width and height you specify. This is useful for ensuring that your images aren’t excessively large in dimension for their display size.

If your page triggers the Properly size images audit, read our guide on how to properly size images.

 

4) Click on “Bulk Smush Now”
 

Click on “Bulk Smush Now” to optimize your images. Note that free users can smush 50 images at a time.

 

Note that the free version of the plugin is limited to bulk smushing 50 attachments at a time. If you have more than 50 images that need to be smushed, you’ll need to revisit this section and bulk smush the next 50 attachments.
 

Bulk smushing in progress.

 

Make sure you don’t exit this section until the smushing process has completed.
 


 

Step 5) Cache Your WordPress Installation

With caching, your website will serve already generated data (i.e., cached content) to visitors, instead of dynamically generating data for every visit.

This speeds up page delivery and cuts down server/back-end time, improving TTFB and other performance metrics.

Again, there are many caching plugins available for WordPress, but in this guide we’ll show you how to set up WP Fastest Cache – a free caching plugin that can help improve back-end performance issues and address a few front-end recommendations as well.

If you’re looking for a high-quality, well supported caching plugin, we recommend WP Rocket to automatically cache your WordPress install and reduce initial server time/TTFB (as well as improve other audits).

Follow the instructions below to set up WP Fastest Cache and add page caching functionality to your website:
 


 

a) Download, Install, and Activate WP Fastest Cache

Download, install, and activate WP Fastest Cache, in the same way you installed the other plugins.
 

Download, install, and activate WP Fastest Cache.

 


 

b) Set Up WP Fastest Cache

Once WP Fastest Cache is installed and activated, you can now set it up to cache your WordPress install.
 

1) Open WP Fastest Cache Settings

On the sidebar, you’ll notice a new option called “WP Fastest Cache”. Click on this option to open the plugin settings.
 

Click on “WP Fastest Cache” on your WordPress sidebar.

 

2) Enable the following settings
 

Enable the above settings in WP Fastest Cache.

 

  • Cache System
    • Enable – This activates caching functionality
       
  • Preload
    • Enable – This tells the plugin to preload your pages. Upon enabling, you’ll get a popup asking you which pages to cache.
      • Check all the categories – Particularly Home
        page, Posts, Categories, Pages
         
    • Leave the “pages per minute” at 4
      • You may need to reduce this number depending on your hosting provider limits.
         
    • Leave the “Restart After Completed” option unchecked.
    • Click “OK”

 

WP Fastest Cache preload options.

 

  • Logged-in Users
    • Enable – Ensures that if you’re logged in, you see the actual state of your pages, not the cached versions.
       
  • Minify HTML*
    • Enable – Compresses your page’s HTML and reduces file size.
       
  • Minify CSS*
    • Enable – Compresses your page’s CSS and reduces file size.
    • Helps with the Minify CSS audit.
       
  • Gzip
  • Browser Caching
  • Disable Emojis
    • Prevents WordPress from automatically loading inline CSS and emoji scripts.
    • Most webpages don’t need this feature, so you can enable this option.
    • Leave this option unchecked if you want to load emojis in your header. More on this.

 
Click Submit when you’re done.
 

Minifying and combining scripts may break site functionality in some cases

Minification and combination of HTML/CSS/JS may impact functionality of your website and should be tested thoroughly to ensure no errors on the website are present after enabling.

This is the reason why we generally don’t recommend minification or combination of JavaScript files, as it is a main culprit for site breakage. More on this below.

 


 

Caution: Advanced optimization strategies ahead!

At this point, you should analyze your page again.

If caching and image optimization provides you with sufficient performance gains, you can stop here and proceed to Step 8.

If performance is still lacking, your page may benefit from certain advanced optimizations like removing unnecessary scripts from various page loads, or other back-end/server optimizations.

Note that you should proceed with caution as these steps could potentially break site functionality, so developer assistance is highly recommended.

 


 

Step 6) Selectively Load Scripts

As you add plugins to your WordPress install, scripts from the plugins get added to the global header of your page, meaning they’re loaded on every page.

So every time a visitor loads your page, all the plugin scripts get loaded too, whether they are actually needed on the specific page or not. The more plugins you have, the more scripts you have – which may impact your performance heavily.

An effective task you can perform to improve page performance is to only serve the scripts that are actually needed on the various pages of your website.
 

Selectively loading scripts only on pages you need them can help improve overall performance.

 
For example, if you use a plugin that generates contact forms, you can make it so that its CSS/JS files are only loaded on your Contact page.
 
 

Asset Cleanup is a plugin that lets you identify and remove unnecessary requests from specific pages so that it can load faster.

Follow the instructions below to remove unnecessary scripts from pages with Asset Cleanup:
 

1) Download, install, and activate Asset Cleanup

The procedure to do this is the same as with the other plugins. Once you’ve activated the plugin, you’ll have access to a new menu option called Asset Cleanup on your WordPress sidebar.
 

Once activated, you should see “Asset CleanUp” on your WordPress Sidebar.

 

2) Open the CSS & JS Manager settings

You should see a list of CSS/JS requests from various plugins, themes, and other third-party services that are loading on your site.

Note that we’re starting with requests that load on your Home page, which is the default option (confirm this by making sure Home page is selected at the top of the settings).
 

The CSS & JS Manager settings shows you all the CSS/JS requests loaded by plugins, themes, and third-party services.

 

3) Identify and unload requests that are not needed on your Home page

One way to identify if a particular file isn’t needed is to look at which plugin is requesting the file, and see what the name of the file is.
 

In this example, the plugin loads a CSS and a JS file to provide contact form functionality.

 
For example – in the above image, 2 files called styles.css and index.js are being requested on the Home page by the Contact Form 7 plugin.

These files are necessarily to style and provide some functionality for a contact form, but if you don’t have a contact form on your Home page, it isn’t necessary to load these scripts on the Home page.

To remove a request from your Home page, click on Unload on this page. If you’d rather remove the request entirely from all pages on your website, click on Unload site-wide.
 

Click “Unload on this page” to remove the request from the particular page; click “Unload site-wide” to remove this request from your site entirely.

 
4) Test your Home Page

Clear your page cache and load your Home page in an incognito/private browser instance to test for proper layout and functionality – make sure that nothing is broken as a result of your script cleanup.

If you discover issues, revert the scripts you unloaded (one-by-one) to ensure you’re not unloading anything that the Home page needs to function or display properly.
 

5) Identify and unload requests that are not needed on other pages

Once you’ve completed the Home page, you can move onto the next pages.

At the top of the CSS & JS Manager settings, click on Pages.
 

Click on “Pages” to find and cleanup other pages on your site.

 

Start typing keywords into the filter bar (e.g., About, Contact, etc.) and click on the page you wish to clean up.

You should now see a list of CSS/JS requests for that particular page. Identify and remove the requests that aren’t needed on this particular page.
 

Unload requests as needed on various pages of your site to reduce bloat.

 
Repeat this as needed for all your website’s pages – and remember to test, test ,test!

 


 

Step 7) Perform Server Optimizations

Web performance is a combination of back-end and front-end performance.

While most of the plugin related optimizations mentioned above are related to the front-end structure of your page, it’s important to ensure that things on your hosting side are also running efficiently.

We’ve previously written a guide on how lost-cost hosting doesn’t mix well with complex WordPress websites.

In addition to choosing more powerful hosting and optimizing your backend code, there are a few things you can do as a WordPress user to improve your site performance:
 


 

1) Preloading the Interpreter

By default, PHP loads and parses each application script whenever a request is made to the server.

Preloading the interpreter involves loading libraries and frameworks into the memory cache before any application code is run. In some cases, this can result in a significant improvement in server processing time.
 

In this example, preloading PHP scripts reduced Backend Duration by more than half, resulting in a much faster overall page load.

 
In the above example, preloading the PHP scripts resulted in a 55% improvement in Backend Duration, speeding up all other relevant page timings and resulting in an overall faster page load.

One way to preload PHP scripts is by using PHP-FPM (FastCGI Process Manager). In WordPress, you can check if your server interface already uses PHP-FPM by hovering over “Tools” on your WordPress sidebar and clicking on Site Health.

Now, click on Info and navigate to the “Server” sub-menu. If you’re using PHP-FPM, the PHP SAPI field should display fpm-fcgi.
 

The PHP SAPI field displays the interface used between your server and PHP; in this case, PHP-FPM is used.

 
 

How to enable PHP-FPM

PHP-FPM needs to be enabled on the server side. You can do this via your hosting admin panel (e.g., cPanel) or you may need to contact your hosting provider’s support team to help you enable it.
 

PHP-FPM can be easily enabled in some hosting services via cPanel.

 
Note that PHP-FPM may not be available for all hosting services and/or packages. This is especially true for the lower cost hosting plans.

If you’re not sure how to enable PHP-FPM, or if your hosting service provides it, it’s best to reach out to your hosting provider support team to inquire.
 
 
Here are some external resources on PHP-FPM:

 

Note that preloading PHP scripts comes with a few caveats:

  • Again, not all web hosts and plan-levels support preloading the interpreter (e.g., PHP-FPM).
  • Preloading PHP scripts is not supported on Windows-based servers.
  • PHP-FPM implementation differs depending on the type of web server used (e.g., Apache, NGINX, etc.).

Developer Assistance Highly Recommended

Preloading the interpreter is an advanced process that should only be attempted by experienced developers. You can safely ignore this recommendation if you’re not confident in your abilities, or reach out to your hosting provider’s support for further assistance.

 
 

2) Updating the PHP Version

It’s also important to ensure that you’re running the latest PHP version for your hosting configuration. Updating your PHP version can help you gain some performance and security benefits as well as access to new WordPress features.

To check your PHP version (you’ll need admin rights), hover over “Tools” on your WordPress sidebar, and click on “Site Health”.
 

Hover over “Tools” on your WordPress sidebar, and click on “Site Health”.

 
If you’re not running the latest PHP version, WordPress will flag it as one of the recommendations. Expand the recommendation, and follow the link to update your PHP version.
 
If your PHP version needs to be updated, WordPress will flag it as one of the Site Health recommendations.

 


 

Step 8) Analyze Your Page Again

Once you’ve attempted all of the above, analyze your site again (via GTmetrix.com) and see the difference in performance!

You should see improvements in the following metrics:

  • GTmetrix Grade
  • Performance/Structure Scores
  • First Contentful Paint
  • Largest Contentful Paint
  • Time to Interactive
  • Speed Index
  • Number of Requests

You should also see improvements in the following audits:

  • Eliminate render-blocking resources
  • Minify CSS/JavaScript
  • Reduce unused CSS/JavaScript
  • Efficiently encode images
  • Enable text compression
  • Serve static assets with an efficient cache policy

Refer to our documentation to learn more on these metrics and audits.
 

Test your page again with GTmetrix – you should see an improvement in performance!

 
Your mileage may vary! Due to the varying nature of WordPress installations, plugin usage and hosting environments, you may not be able to considerably affect all of the above metrics. Things like third-party resources (Facebook widgets, YouTube embeds, etc.) and ads can still heavily affect your score.
 


 

Important Notes

The steps mentioned above are meant to be a general guide on optimizing your WordPress site.

However, they do come with a few caveats and things to be concerned about.

We breakdown the most common and important ones below:
 


 

1) Test After Minifiying and/or Combining Scripts

Minifying and/or combining scripts can break functionality on your website.

  • Minification essentially goes through your scripts and removes extraneous data like comments, formatting, whitespace and other things that computers don’t need to read.
     
  • Combining CSS/JavaScript files takes the contents of each individual file and aggregates them all into a single file.

Because these processes modify data, it may break functionality due to coding typos, syntax errors, duplicate function names, etc.

Make sure to check your site functionality after enabling the minification/combination features. If you find things are broken, disable all minification/combination features, and re-enable them one-by-one to find out which feature is causing the issue.
 
 
Note for combining stylesheets/scripts

Combining CSS/JavaScript files is only recommended for HTTP/1.1 pages.

If your hosting environment supports HTTP/2, combination of files is likely not needed, as the HTTP/2 protocol has improved connection concurrency for requests.

However, if you have more than 100 CSS/JS requests, then your page may likely benefit from combination of files, even if you’re on HTTP/2.

More on this.

 


 

2) Clear Your Page Cache After Making Site Changes

Whenever you make major changes to your site, like adding a plugin or modifying the CSS/theme, it is recommended to clear your page cache to ensure you’re serving the latest version of the site.

In WP Fastest Cache, you can do this by visiting the “Delete Cache” tab, and then clicking on “Clear All Cache”.
 

Delete your cache after major changes in your theme or after adding global plugins to ensure you serve up-to-date content to your visitors.

 
WP Fastest Cache will automatically preload the cache again after you’ve deleted it. New content like posts or pages do not require you to delete the cache.

 


 

3) Consider Using a Content Delivery Network (CDN)

Content Delivery Networks (CDN) can help your site load faster globally by storing and serving your static resources through server nodes all around the world.

While CDNs are an appropriate solution for most websites looking for speed improvements, not every site necessarily needs one. We’ve written an article on what CDNs are and whether you need to use one.

If you decide to use a CDN, you can integrate it with WP Fastest Cache to prevent any potential incompatibilities that may arise due to conflicting settings.

To do this, navigate to the CDN tab in your WP Fastest Cache settings, and select the CDN that you’re using.
 

Integrate your CDN with WP Fastest Cache to ensure there are no conflicts.
 
Follow the instructions to integrate your CDN with WP Fastest Cache. For Cloudflare users, here’s a guide from the plugin developer on integrating Cloudflare with WP Fastest Cache.

 


 

Summary

WordPress has many plugins that not only allow you to easily create a full-featured website, but also optimize performance for a good user experience.

The above optimization plugins are a good overall fit for most websites, both in terms of compatibility and improving site performance.

If you have a WordPress site, give this guide a try and improve your page experience for all your visitors.

 


 

Need help? Hire a Developer

We only recommend products and services that we’ve reviewed and tested ourselves. Below you’ll find affiliate links to our optimization partners – If you decide to purchase their services through the links provided, we may be paid a commission at no extra cost to you.


Is your WordPress site still running slow?

We recommend finding help using one of our optimization partners. They’re a great option for website owners that want to improve performance, but don’t have the technical skill to implement optimizations.

Have a look at our partners below:


 

Got a WordPress site?

Fiverr

Check out WP Speed Guru – a WordPress optimization specialist who can help you improve performance of premium themes, WooCommerce implementations and all things WordPress.

Optimize your WordPress performance today

 


 

Need help? Hire a Developer

Fiverr

We recommend finding help on Fiverr. This is a great option for website owners that want to improve performance, but don’t have the technical skill to implement optimizations.

Visit Fiverr, register for an account, and search for a speed optimization service that matches your platform, whether it’s WordPress, Magento, Shopify, Squarespace, Opencart, etc.

Find an expert to help with your site today

 


 

Got an Enterprise-Level WordPress, Magento, or Zencart site?

Numinix

The expert developers at Numinix can give users the gift of a great website experience by improving your website’s speed.

Reach out to Numinix today