Over the last few months, I’ve been looking at how local WordPress websites from the Metro Vancouver area perform in the most common speed tests and how I would make WordPress faster in each case.
The vast majority of sites I reviewed were built with popular and well-supported page builders like Beaver Builder, Elementor, Divi and Astra.
And yet, most websites failed to load pages within the recommended 2-3 second window.
This is something business owners should be aware of as Google’s Page Experience Update to the Search Algorithm is being rolled out from May – August 2021 and brings page load times and other factors to bear on search rankings:
“Search has added a variety of user experience criteria, such as how quickly pages load and mobile-friendliness, as factors for ranking results. … the Chrome team announced Core Web Vitals, a set of metrics related to speed, responsiveness and visual stability, to help site owners measure user experience on the web.
from Google Search Central Blog
Luckily, for most of the websites I reviewed, page load performance problems could have been avoided with just a few steps, some simple and others involving a bit more work.
In this article, we’ll look at the page load improvements you can likely make yourself and the type of optimizations that you should probably hire a developer to do for you.
Table of Contents
Why Make WordPress Faster?
There are many reasons to optimize your website for speed:
You Have a Lot of Content to Share
If your site depends on your site visitors browsing through lots of content page, product pages, or video content, you’ll start to lose your audience if your site slows down.
A great example of this scenario are cooking and recipe blogs. They are quite often sluggish for page loads and scrolling as each page is constantly loading pop-ups, video overlays, and reams of tracking scripts for marketing data analysis (ie. Google Analytics, Hotjar, etc).
Other examples: eCommerce stores, niche blogs with lots of content (cooking blogs, product reviews, niche news stories, etc), any website with a forum, video marketing, and online course websites.
Your Website is Busy and Gets Lots of Traffic
If you have a popular website with lots of users visiting concurrently (all at the same time), they could experience a slowdown and poor browsing experience.
This applies to any site that has mainstream appeal. Remember that it can also apply to you if you have a smaller niche following because it all depends on your server resources with your web hosting provider.
SEO is Essential to your Business Success
If you have an SEO campaign to attract more website users from organic search you risk having your hard-earned top ranking pages and posts fail to connect with your audience if the those pages and posts don’t load right away – especially on mobile.
You Offer Visitors an Interactive Experience
If your site offers interactivity, dynamic forms, displays data dynamically from custom post types, or any feature that requires processing in the background, a slow website will create usability issues for your site visitors.
The most common example of this is having a fancy animation in the header of your landing page. While this tends to work fine on desktop, it is usually a mistake to use it for mobile users, as well.
Mobile Users are an Integral Part of Your Business
These days people expect websites to load fast on mobile.
And if your site is slow because there’s too much data being loaded behind the scene or your images have not been optimized properly, you could even be costing your website users real money in monthly bandwidth fees.
But, really, it’s that first impression that a user on your website gets when they search for the service or product you offer or find you on Google Maps. If the site loads quickly and it looks great, congratulations, you’ve potentially gained a lead.
If, on the other hand, your site loads slowly, stalls on certain key pages, or is not responsive, that user may click away and try another website.
Useful Tools to Get a Feel for Your WordPress Site Speed
When reviewing how a site performs, you can use a number of tools to look at different data regarding your website performance.
If you are making comparisons from month to month, be sure to test your website with the same tool each time. One caveat is that some tools undergo major updates every so often, so keep an eye out for that.
For example, the Page Speed Insights from Google has changed quite a bit over the last year and so you may even see your scores go down.
Not to panic. You can use Page Speed Insights to *ahem* gain insights into what might be impacting page load speeds on your website pages. The detailed report can help you or a developer diagnose the problems that need the most attention.
Other tools provide similar and complimentary analysis of your website:
- WebPageTest.org (also includes a Security rating, which most sites fail)
- Pingdom Speed Tool: especially good at catching HTTP requests and network issues
- GTMetrix
- KeyCDN
- Query Monitor (a WordPress plugin) helps you evaluate plugins, themes and scripts on your WordPress site
- Google Analytics: you can compare page load times from year to year and cross reference with bounce rates
Be sure to test your site from a variety of devices and browsers.
Top 7 Ways to Make WordPress Faster
1. Optimize Your Photos (Do it Now!)
WordPress makes is easy to upload your own content and photos. Too easy.
You can upload massive photos with print-level resolution with no warnings from WordPress. These photos, more than anything, will slow your page load to a crawl the first time someone visits your website.
If you had your website built by a WordPress developer, he or she should have helped you optimize your photos by:
- letting you know how to crop and compress each image so it displays properly
- installing a plugin to automatically crop and compress your photos (not always the best idea)
- installing a caching plugin on your WordPress site (see #2 below)
- using a CDN for your content delivery
If you don’t use any kind of caching for your content, your gigantic photos will need to load on every page they are shown.
Pages that have less than 500kB of data tend do well in speed tests. But often a single photo that has not been optimized can be several megabytes in size.
And that single photo, especially if it appears in the header or above the fold of your landing page, can stop the rest of the page from loading, so you make the user wait until it loads to see all the rest of the content.
This is not a great first impression.
The lesson here is that you already have the power to speed up your site simply by paying attention to image sizes. As a general rule, a large full width image should be smaller than 250kB and everything else well under 100kB.
If your website depends on showing your audience lots of images, this should be your number one priority.
Using tinypng.com is an easy way to get started on optimizing your photos. If you have Photoshop, Gimp or any simple image editor, you can quickly pare down the size of you photo.
For example, here’s a screen shot of the result of my photo conversion after resizing it for this article:
- Load image into Image Editor (in my case Gimp for Linux)
- Crop or resize your image to the actual size you’ll use on your website: for a blog post, probably something like 800 pixels by 600 pixels, which is what I’ve done here.
- Export your photo as a jpg or png (in most cases, you should use the jpg format)
- Run it through the TinyPng.com app (drag and drop or open it by clicking on the element)
- Upload your new photo to WordPress. It should be about 150px or less. Some pngs with transparent elements will be well under 100px.
If you have a blog with many, many photos, this is essential, even with lazy loading (see below). Lazy loading a gigantic image will still take many seconds.
Pretty simple!
2. Install a Caching Plugin and/or Enable a CDN
Both of these tools essentially save a copy of your website pages, images and scripts and show it to your visitors in different ways and to solve different problems.
Site Caching vs. CDN
A Caching Plugin is usually a simple way to speed up your website, especially when your content, images and theme don’t change that often.
A Content Delivery Network (CDN) is a network of servers that store a copy of your website on them so that users can access content from a server much closer to their location.
Some popular and effective Caching plugins include:
- WP Rocket
- WP Super Cache
- Web host caching plugins like SG Optimizer
Be sure to check with your web hosting to make sure that the caching plugin you want to use or has been recommended by your WordPress developer hasn’t been banned or restricted for security or performance reasons.
Your host may also already perform caching on your server (the computer that hosts your website) so adding a caching plugin may cause some unwanted conflicts for your website.
Content Delivery Network (CDN) in Detail
A CDN is a network of servers in different geographical locations that all have a copy of your website. You can set this copy to update from your live site at regular intervals. Essentially, a CDN prevents all your website traffic from going to one server, which could slow down your site or even overwhelm it. This is how CDNs can be effective at preventing DDoS attacks on servers, most of the time.
Putting your content makes a lot of sense if you need a global or broad reach for your business or organization. For your site in Vancouver, it’s definitely great for site visitors from Europe to access a CDN proxy server located in Switzerland. That server is closer and your site will load much faster.
Cloudflare is a CDN that is popular because it is free until your traffic gets to be hot and heavy. There are many other providers.
Keep in mind that if you have a local audience that having your site on a CDN may actually slow things down if the closest server proxy is many miles away.
How does Caching Work to Speed Things Up?
A WordPress website stores posts, pages, images, attachments, comments in a database and also serves code that styles your website (CSS) and gives it functionality (Javascript) from files or external resources.
And each time someone visits your site in their browser, the browser retrieve those assets and code to render the page you’re visiting – it can all happen in milliseconds.
It’s like a placing an order in a drive-thru through window. You place your order and in a minute or two, your burgers and fries and milkshake appear at the drive-thru window like magic.
With a caching plugin, the next time you come to buy your “usual”, your order would already be right there at the window when you drive to get your food. No need to wait.
Caching works well when your site doesn’t have frequent changes. In most sites, there are a large number of assets that don’t change too often, so caching is quite useful.
A caching plugin creates a static copy of your website’s pages so that it loads way faster.
If your website is a brochure site, a portfolio, a blog, or even a business site, it will benefit from caching. An eCommerce site typically needs to exclude product pages from caching so that the stock and details are always up to date.
Luckily, most caching plugins or solutions have a options that make those exceptions easy to set up.
3. Avoid Plugins that Perform Site-Wide Actions
There are many plugins that you can use with WordPress that scan, review or analyse your whole site.
This is considered a bad practice for plugins that actually only need to run its code on a certain page or block, but instead loads the code on every page on your website (for no reason).
Example 1: Contact 7 Form builder plugin for WordPress.
You would think the code would only be needed on the pages when you’ve added a contact form, right? Not so. Instead, the code is injected all over the website, adding extra CSS and JavaScript that has to be loaded each time someone lands on any page or post.
A better plugin choice is WP Forms, which only adds code where you need it – on the form element itself.
Example 2: Automatic site back-up plugins.
Most good web hosts now offer daily snapshots of your whole website including your database with an easy option to roll things back if something goes wrong.
A common mistake is to enable a backup plugin in your WordPress admin and store the backups on your server.
Ideally, if you do need to use a plugin, you would set-up the backup target to a remote destination, on a Dropbox or Google Drive account, for example.
Making backups that reside on your server can cause you to run out of memory or incur costs for extra storage.
The General Rule of Thumb for Plugins
Plugins should perform a single task or solve a problem exceptionally well and leave the rest of your site alone. Plugins built with this in mind are easier to test and are less likely to slow down your site.
4. Make Sure WordPress, your Plugins, PHP and Security Settings are Up to Date.
Keeping your site well maintained helps keep your website fast, secure and online.
Remember to back-up your WordPress site and database before performing updates.
And ensure that your backups are stored in the cloud or your local machine, and not left on your WordPress site. (Because if your site breaks, you won’t be able to get to it.)
WordPress Core Updates
It bears repeating that you should keep your WordPress core up to date. At the time of writing this article, WordPress is up to version 5.7.2.
You can expect WordPress to update its core software every 2-3 months on average:
WordPress 3rd-Party Plugins
Plugins should also be kept up to date. If a plugin is no longer supported, it’s a sign that it may not play nicely with your up-to-date theme or the newest WordPress installation.
Plugins are often updated to fix security holes, so it’s vital that you keep on top of that, too.
A plugin that hasn’t been updated in over 1-2 years is something to look at closely to see whether it can be replaced with another, actively maintained plugin.
PHP Updates
Recently, I had two clients who both had WordPress sites that had out of date PHP running on the web hosting server.
You may also have seen a warning in your WordPress dashboard recently that says “Your PHP version is out of date.”
As the helpful notice says, PHP is the coding language that WordPress is built on.
Every few years, programming languages get improvements that make them faster and more secure. Currently, most high quality WordPress hosts offer PHP version 7.4. And WordPress highly recommends that you do not use a version of PHP lower than that.
If you have a website that you haven’t updated in a while, you may still be running version 7.0 or even 5.4. Not good. In computer terms, these versions of PHP are ancient.
Bottom line is that the newest version of a coding language will perform its magic at faster speed, especially with software (ie. the most up to date version of WordPress) that is written in that version of the language.
5. Switch to a Better Hosting Company and Domain Registrar
If you serve local clients in a city, town or region, this one is really important, especially if you’re having trouble with a slow initial page load.
Simply put: you may have registered a domain and found a cheap host for your website. But what you may not realize is that those companies have servers that are thousands of miles away or perhaps even in another country.
Sometimes finding a good quality domain registrar (to manage your DNS settings) and a web host (to host your website files) nearby can make your site much faster.
Other times its the quality of the DNS or hosting solutions that those companies provide (or don’t provide) that can be a real factor for your website speed.
For example, imagine you have a hardware store in West Vancouver with your products listed and managed online and 85% of your customers come from a 50km radius.
And to make this example simple, let’s say your WordPress site is hosted in Florida, USA, with its domain registered with a company that has its servers located in San Fransisco.
So your next potential customer has to wait for her browser to lookup your website URL on a DNS server in San Fransico and then fetch the website pages and data from a server located 4,000km away from your business.
All this might add as much as an additional second to your page load time.
Instead, you could choose from a number of reliable web hosts in Western Canada or the USA.
Now, if your business is taking off, and you’re getting more and more customers from around the world, it’s not as important. You’ll want to use a Content Delivery Network (CDN) to make your website load fast for customers far away.
In addition to finding a hosting company that lives nearby, you’ll also want to check the reviews for hosting companies optimized for WordPress hosting and fast servers.
And finally, if you share a server with many other websites, your site may slow down because everyone is busy and competing for server memory, or if one site on that server gets hit with crazy traffic. Shared hosting is usually the least costly, but not as reliable or fast as dedicated hosting like Kinsta or WPEngine.
6. Lazy Load Images and Widgets
What is lazy loading?
Lazy loading prevents images (or elements) that appear below the fold or hidden from view from loading in the web browser before they are needed.
You have probably seen this in your internet browsing. And it’s now a default feature of the latest WordPress version and in most web browsers, too. So there’s no need to install a Lazy Loading plugin if your website is all up to date.
But I wanted to mention it in case your site is older and you don’t have lazy loading enabled by a plugin. One more reason to upgrade.
In WordPress, lazy loading applies to the following images:
- blog posts, pages and custom post types
- any images added to text or custom HTML widgets
- blog post avatars
- images in the media library
This covers the most common scenarios for most websites. Custom lazy loading can also be implemented with a developer’s help, should you need it.
A Word About Custom Widgets and Lazy Loading
Lazy loading widgets can be a huge speed booster.
If you have widgets that load content from an external source, such as article share count from Facebook or Pinterest shares for images, these should be loaded only when users view them, otherwise they will slow down the initial page load.
There are a number of plugins that can help you achieve this. Just be sure to choose a plugin that makes it easy to cache the share count (or whatever data the widget is fetching from an external site or data source). That way you won’t see you site slow down as it constantly updates that widget on every page load.
Lazy Load with Restraint, My Dear Friends
Have you seen websites that load each element on the page as you scroll down?
Have you seen websites that show those elements sliding down or from the left or right side of the screen, or with a little bounce, just for kicks?
Please resist them temptation to make your website a bouncy castle.
You may not realize how hard on the eyes it can be for people with poor eyesight or disabilities.
All that bouncy and flash may actually distract you from what you want your site users to do when they are on your site. Focus your visitors’ attention on your call to action, don’t distract them with bells and whistle.
7. I personally use Easy Social Share Buttons for WordPress as I have always found it to be the fastest social plugin around. However, there are some other good social WordPress plugins as well.
What You May Need A Developer to Help You With
There are a lot of steps you can take on your website to make WordPress faster. We’ve covered the steps that are easier to implement for business owners who like to manage their own website.
You might feel comfortable tackling the steps listed below. But if you’re not sure what these changes mean, I would recommend you get some help from a developer who can explain or at least asses your website to tell you whether they are needed or not.
Generally speaking, it’s usually just a few key things that slow down your site.
Use Async or Defer JavaScript for Marketing and Analytics Tracking
In most cases, you should defer the loading of Google Analytics and other marketing tools to the bottom of the page so that they load only after all the elements on the page (images, text, etc) are loaded.
This is normally a simple step, but a developer can help you understand when you might not want to do this and how both options might impact your data.
Switch to a Lightweight Theme
If you site is consistently slow after you’ve made some of the changes listed above, your theme may be the culprit. Shedding old code and upgrading your website to take advantage of what modern WordPress has to offer could make all the difference.
But, you’ll want to get a deep understanding of the risks, costs and timeline for switching over to a new theme.
Clean Up and Optimize Your WordPress Database
There are some plugins and workflows for checking on the health of your website’s database. Most sites use more storage with old images, improperly deleted plugins, super old page or post revisions and other temporary files clogging up the database.
Doing a thorough cleaning is not something I would invite the casual WordPress admin to do on your own.
It does make your site faster, reduce costs for hosting and makes site backups (and restores) a lot easier.
Replace Old Plugins with New Ones
As we’ve discussed above, old plugins that are no longer maintained are bad for business. They can break with WordPress updates and are often targets of hacking.
Finding the right plugin to replace the decrepit one can be a headscratching process if you’re not exactly sure what that plugin was needed for in the first place.
Not all plugins have great documentation, so a developer can help shorten that research time and quickly and safely test its replacement with your site in a staging environment (so any glitches don’t break your live site).
Properly Configure the Settings for a Content Delivery Network (CDN) or Premium DNS
A CDN is pretty straightforward in theory, but in practice there can be lots of gotchas for dynamic sites, blogs and eCommerce stores that require some fine tuning.
Minify and Bundle Scripts
There are a number of plugins that excel at combining many CSS and JavaScript files into compressed and fewer files to save on the number of HTTP requests your site needs in order to load properly.
However, if you site has a lot of scripts and they need to be loaded in a specific order, this can get tricky.
Upgrading to the Latest Version of PHP
This is a fairly major step that can break your site, especially if your plugins and theme are not up to date. Some code that worked fine in PHP 5.5 or PHP 7.3 or lower, have been deprecated in favour of newer approaches.
Before you do this, you’ll want to:
- check with your web host on how this will be done and how to roll back if there are problems
- have a developer test your theme before you even start
- test any older plugins that have not been maintained for PHP bugs (since plugins rely on PHP, too)
- use a staging server
- backup your entire site to a 3rd party location
Here’s what can happen if you theme or plugins are no longer compatible with the newer version of PHP:
- when you load a page, you’ll see a 500 Server Error (or a variation of that error code)
- you’ll see nothing! (the white screen of death)
Don’t worry! You’re using a staging site, right? This is part of the testing, so you or a developer will check to see whether it’s the theme or a plugin that is causing the issue and make the necessary changes.
In Conclusion: Making WordPress Faster is a Strategic Process
If you’re feeling overwhelmed by all the things that you need to manage for your WordPress website to perform well and be a reflection of your brand and what you offer to clients, I can relate.
The good news is that you don’t have to do it all at once.
In fact, even if you just started with fixing your images on your current site, that would make a big difference.
And if you have a big site with lots of content, it can take a while to get through it all. So you need to pace yourself.
A WordPress developer can help you fix the most common issues quickly. Drop me a line if you need help.
But, as with all things in your business, understanding something like website page load speed and how to determine which optimizations will give you the biggest wins with minimal disruption to your business is what its all about.
I hope that this post helped you feel a little more confident about how to assess your page load times and how to evaluate the improvements that you need to make.