The new metrics for web performance
Joomla 4 performs exceptionally well out of the gate on Google Lighthouse at Joomla Australia's Virtual User Group. Google Lighthouse is Google's open-source, automated tool that gives you feedback that you can use to improve the quality of web pages. You can run it against any web page, public or requiring authentication. It has audits for performance, accessibility, SEO and more.
The Main Scores
Lighthouse returns a score out of 100 on each of the four main metrics.
Performance - Score looks at how quickly the page loads, how much the page changes during loading, whether resources load in the proper order and more.
Accessibility - Measures how accessible the site is by looking at features like aria tagging, alt tags on images, contrast ratios and other factors.
Best Practices - Checks if your software is up to date or otherwise vulnerable, the use of Content Security Policy (CSP), and provides some quality assurance checking on features like image quality amongst other tests.
SEO - Checks if the site has meta descriptions, images have alt tags, links have descriptive text and other more subtle checks relating to the site's appearance in search engines.
Getting your score up in Joomla 3
In a Joomla Australia Virtual User Group presentation back in April, I took the audience through several simple things you can do to increase your Lighthouse scores for Joomla 3. There were some simple things on the list.
Simply checking your meta descriptions and image alt tags around your site are all in place is an easy way to boost your SEO score. Just by correcting what Lighthouse was recommending saw a 10 - 15 point jump in the SEO result.
Performance and Best Practice scores can be a little trickier to improve, but optimising your caching, turning on gzip compression and adding a few lines to your .htaccess file to leverage a feature called browser caching all quickly increase your score if they've not already been turned on for your site. You can also look at a range of Joomla extensions that have various features to assist with your website's performance. For example, Akeeba Admin Tools has features in the .htaccess maker tool that add the required lines to the .htaccess file to improve performance. At the same time, you can use extensions like JCH Optimize to improve caching and add features like lazy loading across your site.
On various sites I've spent time improving the scores on, I've typically seen a 10-20 point performance score increase and have on some occasions made 40-60 point improvements on sites that had significant performance issues that needed to be fixed.
Accessibility is a little harder to improve in Joomla 3, but if your site is well structured as well as already optimised for SEO, chances are you'll be scoring in the 90's before you look at making any changes.
There's a number of factors covered in the video from April. By the end of the session, we were getting scores in the high 90's across all four metrics.
Joomla 4 is a game-changer
Since April, the discussion in Joomla Australia circles has moved to Joomla 4, especially how well it performs. The short answer: Phenomenally well.
Special attention was given to several Joomla 4 features to ensure it performs well in Lighthouse. These include postponing loading of render-blocking resources, implementing lazy loading, and focussing on ensuring Joomla's core functionality is highly accessible.
Out of the box, with only a few SEO factors addressed, it's possible to have Joomla 4 score 100 for all the metrics immediately (or at least high 90's depending on your hosting). Even once you've begun adding some content, you'll find it continues to score highly even before you start looking to optimise your site.
Making the same changes as we made in Joomla 3 during the Joomla Australia User Group session, there's nothing more exciting (to website optimising enthusiasts) than seeing 100 across the board.
It comes down to ingredients
Lighthouse comes with a range of jargon appearing in the results, and so in future articles in this series, we're going to talk to some engineers at Google and have them explain what some of the more complicated ones are and how to resolve them.
However, if you're reading this article with a thought to improving your Lighthouse scores, knowing what some of the ingredients are that lead to reduced scores will help you make some quick improvements.
Five quick points any site maintainer can check to improve scores:
- Check your site has a global meta description in the Global Configuration
- Add meta descriptions for each page on your site
- Ensure all images have alt description text where possible
- Check caching and gzip compression are turned on in your Global Configuration
- Investigate adding Expires headers in .htaccess to leverage browser caching to speed up your site.
What else do you want to know about Lighthouse?
Already we're looking at explaining more about Core Vitals, the new feature in Google Search Console that performs the site analysis. We're also going to find out more about First Contentful Paint and Cumulative Layout Shift, which are both performance features that can quickly impact your scores.
Reply in the comments or reach out to ask other questions you have on how to improve your Lighthouse scores.