We are aiming to raise £10k to help 4 small local charities in Brixton. Visit our Just Giving page.

Weekly News Roundup (11 – 15 October): Web

Weekly Roundup

Happy Friday from everyone here at Passion! This week’s roundup comes directly from our Web team, who are sharing their insights on WordPress, core web vitals and plugins. 

As originally reported by Search Engine Journal, WordPress has acknowledged it is losing ground to out-of-the-box CMS platforms, such as Wix. It also admitted that the responsibility to tackle core web vitals, such as speed, belongs to WordPress itself and not the plugins.

Although this is welcome news, it could be quite some time until WordPress tackles this and, as we all know, optimising WordPress sites is often time consuming and cumbersome.

With a wealth of compression and caching plugins out there we thought we would share some of our favourite solutions that have helped our clients using WordPress.

1. Offload Third Party Tracking Scripts to Google Tag Manager

Serve only functional JavaScript from your WordPress website – and don’t forget to load these asynchronously or defer them when the document parsing is complete. 

Plugins add scripts to your website, and you should be keeping a close eye on how and where they’re being handled. Any additional tracking scripts should be fired from Google Tag Manager, but this doesn’t necessarily mean your page speed score will dramatically improve – you’ll need to make little tweaks to help you claw back a point or two.

Recently, we were having trouble with the HotJar tracking code and, after moving it over to GTM, we were rewarded with a few more page speed points. This little trick won’t work for many tracking codes but it gives you an idea of how you can experiment with Google Tag Manager.

2. Caching Plugins and Content Delivery Networks

One of our favourite setups is Autoptimize, WP Rocket and Cloudflare. We use Autoptimize to minify and concatenate all our CSS and Javascript files into one. We then utilise WP rockets brilliant caching tool to create, cache and serve static HTML pages.

We also take advantage of WP rockets ability to process critical CSS by taking the bare minimum CSS needed to display a website and applying in-line for faster loading. This contributes greatly to the first contentful paint (FCP) and helps tackle the dreaded flash of unstyled content (FOUC).

WP Rocket also offers a great CDN to handle delivering media in WEBP formats – but we have been long time fans of Cloudflare thanks to the additional security features.

3. Go Headless and Serve Static HTML to Reduce Server Response Time

Take advantage of WordPress’s built-in API and use a static site generator such as Gatsby JS to source your content and serve static HTML web pages to the browser.

There is a wealth of static site generators out there and you are not limited to Gatsby JS (a react framework). The advantage of this approach is you are eliminating the need to request data regarding your website, processing that data and then serving it to the browser. This is all done at build time before it goes up on your server.

We recently migrated our very own website to Gatsby JS and WordPress as a headless CMS. Keeping on top of our Core Web Vitals has been a lot more manageable. Thanks to a modular approach, each component has its own CSS and Javascript associated with it which can be easily optimised, as opposed to optimising large and often messy CSS and Javascript files.

We know how difficult it can be to understand the technical side of website building, and we know you just want to be able to have a functioning website for your business. Thankfully, our Web team are experts at figuring out any problems, and are always open to having a chat! Give us a call or drop by to find out how we can help.