WordPress Plugins & Speed
WordPress websites are absolutely massive these days, and the amount of features in them makes coding individual files too complex for the average WordPress user. Plugins give you a user interface, allowing you visual control over your website without having to resort to coding headaches.
The days of using lots of plugins being frowned upon has generally passed. If your website is correctly optimised, you can use as many plugins as you wish. The purists may want to go with raw code and minimal plugins, but for sheer ease of use and flexibility, I can only recommend installing these plugins to give you the most control over your website. You could be making hundreds of small changes as you optimise individual pages and the plugins listed below allow you to take control of your website’s inner workings.
That is the real thing about pagespeed. You are not just optimising your homepage. As you get into it, you will be optimising all your pages individually. Loading different scripts on different pages, tweaking, testing – you name it, you’ll be trying it. Pagespeed can be addictive!
I will list my recommended plugins to use below. The list is not exhaustive. You can try different variations of the plugin types such as Autoptimize instead of Asset Cleanup Pro. Find what works best for you, but this guide will focus on the plugins that I feel work best for a range of website types and styles, whilst giving the most versatility.
Install These Plugins
Asset Cleanup Pro
Firstly, go for the Full Paid version Of Asset Cleanup Pro as it’s more feature packed, and never download a free copy of any plugin. These could have malicious code in, and are never updated leaving you very vulnerable.
WHAT DOES ASSET CLEANUP PRO DO?
It’s like a whole stack of optimisation plugins in one. It also gives huge control over every single page in your website. You can load / unload scripts down to the page level, you can unload unused WordPress features, you can defer code, and control your plugins.
In a nutshell, it is the best plugin to get control over your website and is highly recommended. I will explain a little on how to use it on the next page.
It has so many features it needs a page of it’s own!
You can run WP-Rocket in tandem with Asset Cleanup Pro if your server does not have a good built in caching system. Asset Cleanup Pro works in tandem with it’s caching functions and they are a good match if you need a caching solution.
Plugin Organizer & HTML Snippets
Plugin Organizer is an oldie but a goldie. Again I will show you how it works on the following pages.
What it does is allow you to disable plugin load by device. Say you wanted to load a JS heavy plugin (like Slider Revolution) on the desktop only, but ensure no scripts were loaded on mobile to save page weight, this is the plugin for you.
You can also combine this with another little plugin called HTML Snippets. What you do is put any heavy code, JS or video’s into a snippet, then put the snippet into the web page builder itself rather than the original code. Then you disable the HTML snippet from loading on mobile. This will be fully explained on the plugin organizer page, but it’s a game changer for web design.
Fonts are surprisingly large in size. Each font file can weigh in at up to 200kb, so you want to use as few of them as possible, and download them to your server so they can be prefetched by the browser for instant display.
You do not just have font styles, you also have font weights. Most of us use Google fonts, and having differing font weights (thickness) can result in additional files being downloaded. Each file a theme downloads results in a call to the Google font servers. You don’t really want this as it is an external connection, which the browser has to download before being applied to the page.
WHAT DOES OMGF DO?
In a few clicks, OMGF analyses you whole website, and downloads your fonts to your server. It’s incredibly simple, and it works. I will again dedicate a page to setting up OMGF later in the guide, but download and install it now. It’s free.
A Quick Tip About Fonts
Always use ‘font-display: swap‘ when asked how you want to display your fonts. This will briefly show standard system fonts without downloading the stylised ones from your theme. Google likes this and it will make a substantial difference to your page load times.
Flying Scripts is actually the name of a developer who makes great speed plugins for WordPress. There are two simple plugins to install. Only install Flying Pages if you do not have WP Rocket installed – as WP Rocket also has preload functionality built in anyway. Total setup time for the two plugins combined is less than 2 minutes and they are both free plugins.
WHAT ARE THESE PLUGINS?
The first one is Flying Analytics. This downloads the Google Analytics script to your server so you are not making slow JS calls to Google when using either Analytics or Tag Manager. I’ll go into it on the Flying Scripts Page, but using Google trackers really hurts your pagespeed.
So go ahead and install that one. The only setup you have to do after activation is put in your Analytics / Google Tag tracking code. I’d recommend setting it to minimal tracking to save code. It’s all you will ever need. And that’s it!
WHAT ABOUT THE SECOND PLUGIN?
It’s called Flying Pages – and that is even easier to setup. Just install and activate it and it’s done. The only thing I would recommend is to set it to preload only on mousehover. This is is because preloading each page from the links can slow the pagespeed score down slightly, even though the loading time for the end user is quicker. Preloading pages on mousehover only activates when the user hovers over the link. This still reduces the page load time for the end user, but solves the pagespeed issue.
Most WordPress websites use themes. Themes are great apart from one thing: they come with a load of bloat.
WHAT IS BLOAT?
Now imagine back to when you bought your theme. You probably bought it because it looked great, had a load of features, and did lots of really cool stuff. The thing is, now you have built your page templates, you probably are not using anywhere near the themes full repertoire of options. This is where bloat comes in. It’s code you do not use on pages, nor is it of any use to you moving forward.
All of those graphics, CSS effects and JS options come at a cost. They will be in the CSS / JS files and will be loaded up on the page whether you are using them or not. When you consider that you are probably not using 70-80% of the CSS in the theme, the amount of unused data being loaded into the browser can be huge. This is where purifying CSS / JS comes into play. We rewrite the files using only the code you need and it results in massive data savings.
HOW DOES RAPIDLOAD HELP?
Again we will have a page dedicated to it, but in essence Rapidload rewrites your CSS so no bloatware is on your pages. It also does it on a page by page basis, in case you are using different layouts on different pages. It’s totally set and forget, and can save huge amount of data – up to 80% off your total CSS weight, which amount to 1mb or more on themed websites.
For the purist, there is a free option to do this at the PurifyCSS Website. You can read how to purify your CSS on their CSS Blog Page. It can get heavy going, especially if you have a lot of pages and Rapidload simply does it all for you.
That is the only plugins you really need to install for now. It will give you the tools to optimise your website properly, without overloading it. Whilst with my Pagespeed Service you will get a lot more manual tuning done, the parts that will take you through this guide will ensure your website will pass Google’s Core Web Vitals and increase your ranking positions.
BUT HOW DO I USE THEM?
We are now going to drill down on what each plugin does for your website, and how to begin getting the speed up. You will see that these plugins have been selected because of their flexibility.
They will allow you to do everything you’ve read about from deferring JS to preloading the CSS.