Improve PageSpeed on my WordPress Site

Share this post

Improving PageSpeed on your WordPress website can be a challenging endeavour, but it is possible.

In this post, I will show you each step to reaching your Core Web Vitals goal.

All these steps didn’t cost me a dime and were implemented solely by myself. Thus, you can do it too.


Subscribe to my Newsletter


Here is what I have learned in the last two years of obsessing with speed.


SiteSpeed Tools

The first thing that you need is to know the tools that you can use to test your site.

The most obvious is Google Lighthouse. Lighthouse is available in Chrome Devtools.

To open Lighthouse, open the developer console in Google Chrome with Option + ⌘ + J (on macOS), or Shift + CTRL + J (on Windows/Linux).

Make sure that you are in incognito mode.

Additional tools that you can use with lighthouse are:


PageSpeed: A Major Effort Commitment

There is no one-size-fits-all solution to improving your site speed, especially on WordPress.

WordPress comes with a lot of cruft, and WordPress themes also bring their load of troubles. Some will tell you that you are better off coding your own site, and they might be right.

But, here I wanted to optimise my WordPress site. Not start from scratch.

It takes a lot of effort to reach your goal, and let’s face it, some sacrifices.

Basic guidelines

  • Purchase a lightweight theme, more features = more challenges.
  • Keep the number of plugins to a minimum
  • Reduce and compress your images

Static Sites – The best alternative to WordPress

Before we get started, let’s talk about an alternative to WordPress: static websites.

WordPress is fantastic for many reasons, but speed is not one of them.

It is possible though to make it fast, but it takes a lot of effort.

The simplest solution to having great site speed is to not use WordPress in the first place.

Instead, build your blog on a static site using Hugo and Netlify.

The static site shows static HTML, removing the need for server requests, thus making your site lightning fast and more secure.


Steps to Improving PageSpeed on WordPress

Here are the steps that I used to achieve decent pagespeed on my WordPress site.

  1. Have a decent host provider (host: GreenGeeks)
  2. Purchase the fastest WordPress Theme possible (theme: Dabba)
  3. Compress all images and use the Webp version when possible (plugin: Imagify)
  4. Use the Caching plugin recommended by my host provider. (plugin: LiteSpeed Cache)
  5. Clean-up unused assets (plugin: Asset Cleanup)
  6. Set-up Cloudflare CDN (plugin: Cloudflare)
  7. Set-up Cloudflare Worker (plugin: Cloudflare Page Cache)

Optimize Images

This is one of the easiest things to fix.

  • Upload smaller images
  • Optimise the images with Imagify

Make sure that you never upload an image over 1000px – 1000px. I try not to upload images over 750px.

Next, install the Imagify plugin.

This plugin will:

  • create images to the webp format.
  • resize images that are too large for your settings.
  • create thumbnails for smaller devices

Install a Browser Caching Plugin

In this step, I hit a few challenges. I started with the most recommended plugin which was W3TotalCache (Bluehost recommends it) but never had any real success.

When I had the most success is when I looked for the answer on my host provider’s website.


Clean-up Unused Assets

This step is one of the most important. Removing. from your site what you don’t need.

WordPress, dependencies and plugins can add a lot of unused code to your pages.

Asset Cleanup lets you select what you want to keep and remove.


Set-up Cloudflare CDN

Without Cloudflare CDN, you will not reach your goal. Fortunately, Cloudflare has a free option for small site owners.

The Cloudflare CDN delivers content to the user from a server that is closer to them. While my host servers are in Canada, users in Australia read my blog from a server-based in Sydney.

You will need to set up a page rule to Cache Everything.

To learn more about CDN, read Koray Tuğberk GÜBÜR’s bible: What is the Content Delivery Network (CDN) and Its Importance?


Set-up a Cloudflare Worker

Now, I finally managed to reach lab data of 100 pagespeed on Lighthouse.

Still, field data in Google Search Console’s page experience report was still not showing a single “Good URL”.

To fix this, I needed to use a caching worker on Cloudflare.

This step was critical to gain all Good URLs in pagespeed insights.

After implementing the worker, I finally helped reach a 100% good URLs in both mobile and desktop.

Yet, there are downsides to using workers:

  • Interactive elements like comments will not be updated.
  • Less convivial as you will need to update the worker when doing major changes on your site.
  • There is also a pitfall in the free version. When reaching 100K requests, the site is blocked. You can get 10M requests for 5$/month.

I wrote a guide detailing the steps to Create a Cloudflare Worker for PageSpeed.

This image has an empty alt attribute; its file name is image-64-1024x344.png

Google AdSense

Now, my next goal is to find solutions to optimize pagespeed on WordPress when Google Adsense is enabled.

As a lot of you may know, Adsense is bad in many ways. Low revenue, horrible performance, and often tanks website’s traffic through lower engagement and nuked page performance.

Here is a beautiful statement of me implementing Adsense.

mobile pagespeed performance in Google search console
Performance drop after implementing Adsense

My plan, is to try out all the solutions in this guide to see if I can fix this horrible drop.

Why keep Adsense Altogether?

Truth is. Revenues are miserable and not worth the loss in traffic.

Why do I keep them?

Because I am in a crusade to a better, more sustainable web.

Everybody uses Adsense and no-one knows how to make it faster for WordPress.

If I can find the solution, I can share the process and help others make it faster.

Once I have done that, I’ll probably get rid of the horrible Ads on my site.

Other Possible Optimizations

Interesting Articles to Improve Pagespeed on WordPress

Conclusion

I’d love to see if you succeeded in implementing these steps.

Please share any additional ideas that II may have missed.