One of the most popular WordPress themes within the free WordPress Theme Repository is the Astra Theme with over 500,000 active installs with the following bold claim: It is very lightweight (less than 50KB on frontend) and offers unparalleled speed.
Local SEO Web Design Service
I’m in the process of researching the viability of offering a new local SEO web design service and though I’ve developed an advanced WordPress SEO theme (Stallion Responsive: currently not available to purchase) it is WAY too advanced for your average local business looking for a new website design which is search engine friendly etc…
My WordPress SEO theme has over 1,000 options, it’s more designed for technical SEO experts (me).
My choice is completely rewrite my WordPress SEO theme (months of coding work simplifying, would need to update the feel as well, it’s getting old) or find an easier to use WordPress theme which is OK SEO wise. I don’t expect to find anything as good SEO wise as my theme, I can work with OK SEO, maybe with a few modifications and some custom WordPress SEO plugins I can take OK SEO to good SEO, maybe be even great SEO.
With 500,000+ active installs and the “unparalleled speed” claim, I’m checking out the WordPress Astra theme.
Astra Theme Unparalleled Performance Hype
From an SEO perspective page speed and performance is very important and on the Astra Theme sales site they make a bold claim, but is it valid?
Astra Theme Unparalleled Performance Hype
Unparalleled Performance: Every single line of code in Astra is profiled for fast performing websites. We have numbers to prove that.
- No jQuery: Many times, render blocking jQuery comes in the way of performance optimization. So Astra uses Vanilla JavaScript instead.
- Less than 50 KB: Astra is feather light. It needs less than 50 KB of resources whereas most of the other WordPress themes require at least 300 KBs.
- Just 0.5 seconds!: With default WordPress data, Astra loads in less than a half second. It is built for speed and fully optimized for performance.
If this is true that’s a good start, I’ve spent days converting WordPress features to NOT use jQuery because of how bloated jQuery is and how jQuery impacts a websites performance!
Being light weight is also important, again spent many an hour converting image based theme features to use CSS instead of images: for example some WordPress themes generate corners via images, for performance reasons it’s better to use CSS styling.
Page speed is VERY important, we should be aiming for super fast, every second wasted to load a website = customers lost!
The Astra theme sales site runs under WordPress and they are using their Astra theme, which means we can run speed tests directly on https://wpastra.com/ to see how fast it is.
Astra Theme Google Lighthouse Results
Astra Theme Lighthouse SEO Report
You can see from the Lighthouse screenshot above the Astra themes sales site homepage performance results for the Desktop Lighthouse test aren’t amazing. Check the full Astra Theme Sales Site Google Lighthouse Report for December 2019.
Want the latest Desktop Lighthouse results, use this URL: https://googlechrome.github.io/lighthouse/viewer/?psiurl=https%3A%2F%2Fwpastra.com%2F&strategy=desktop&category=performance&category=accessibility&category=best-practices&category=seo&category=pwa&utm_source=lh-chrome-ext this will generate a new Google Lighthouse SEO report for the Astra theme homepage.
Want to see a harder test, check the latest Mobile Lighthouse results, use this URL: https://googlechrome.github.io/lighthouse/viewer/?psiurl=https%3A%2F%2Fwpastra.com%2F&strategy=mobile&category=performance&category=accessibility&category=best-practices&category=seo&category=pwa&utm_source=lh-chrome-ext this will generate a new Google Lighthouse SEO report for the Astra theme homepage. They get terrible SEO performance results in the Mobile version!
At this stage I don’t know specifically what is slowing down the Astra theme homepage, it could be the Astra theme or it could be features added via various WordPress plugins. Webmasters tend not to install a WordPress theme and nothing else, they install multiple WordPress plugins and if they aren’t careful it can wreck a websites performance/speed. You can see for example they use a jQuery feature, so must be using a plugin which needs jQuery
You can see from the screenshot below for my SEO Gold websites homepage, it has much better Lighthouse results vs the Astra theme homepage.
SEO Gold Lighthouse SEO Report
Want the latest results, use this URL: https://googlechrome.github.io/lighthouse/viewer/?psiurl=https%3A%2F%2Fseo-gold.com%2F&strategy=desktop&category=performance&category=accessibility&category=best-practices&category=seo&category=pwa&utm_source=lh-chrome-ext this will generate a new Google Lighthouse SEO report for the SEO Gold homepage.
Want to see a harder test, check the latest Mobile Lighthouse results, use this URL: https://googlechrome.github.io/lighthouse/viewer/?psiurl=https%3A%2F%2Fseo-gold.com%2F&strategy=mobile&category=performance&category=accessibility&category=best-practices&category=seo&category=pwa&utm_source=lh-chrome-ext this will generate a new Google Lighthouse SEO report for the Astra theme homepage. the SEO Gold homepage has awesome SEO performance results in the Mobile version as well: on a good day it’s 100/100 for all 4 tests.
It took a LOT of work to achieve speed results this good, if I installed a website feature which required jQuery (like the Revolution image slider plugin) it would lower the page speed (performance) results considerably.
If you want speed/performance it cannot be achieved by installing a WordPress SEO theme (no matter how good it is) and then randomly add features (WordPress plugins) without checking how they impact performance.
EVERY website feature added will have a performance hit.
Add AdSense ads for example and the AdSense javascript (a .js file) is fetched from another server and this slows a website down.
Embed YouTube videos, Tweets from Twitter etc… and it’s more connections to sites you have no control over and it hurts performance!
Take a look through the Eliminate render-blocking resources issues for the Astra themes homepage. There’s a potential 1.53 seconds savings. To put that into perspective my entire SEO Gold homepage was loaded in 1.3 seconds and that’s at a time when I’m having a Virtual Private Server problem adding 0.3 seconds to the load times (I’ll be upgrading servers soon).
I can see the Astra theme site is using the Elementor plugin and under Eliminate render-blocking resources issues there’s around 100KB of render blocking js and CSS files listed.
So the Astra developers are bragging their theme is only 50KB in size then are using a plugin which adds 100KB of render blocking javascript and CSS files.
Maybe I’m being unfair, let’s see how they perform in GTmetrix, they use GTmetrix speed results as a selling point.
Astra Theme GTmetrix vs SEO Gold GTmetrix
GTmetrix is a page speed testing service, let’s compare the Astra theme sites homepage with the SEO Gold sites homepage.
Astra Theme GTmetrix vs SEO Gold GTmetrix
Astra Theme GTmetrix Speed Results
- PageSpeed Grade B (82%)
- YSlow Grade D (66%)
- Fully Loaded time 3.8s
- Total page size 2.21MB
- Total # of requests 101
The Astra themes homepage GTmetrix results aren’t very good, it’s not terrible, but for a WordPress theme they are selling as having “Unparalleled Performance” that’s poor.
I’m afraid Astra might be mis-advertising their Astra theme, my WordPress SEO theme (called Stallion Responsive) has much better performance results.
SEO Gold GTmetrix Speed Results
- PageSpeed Grade A (100%)
- YSlow Grade A (96%)
- Fully Loaded time 0.7s
- Total page size 121KB
- Total # of requests 14
I could describe my WordPress theme as having “Unparalleled Performance” (I used to), but there’s some OK SEO themes now and it’s only a matter of time before one is faster. Even them it’s not JUST the SEO theme which resulted in this level of performance.
I use a handful of WordPress performance plugins including a caching plugin, a lazy load plugin, an image plugin which converts jpgs to webp images plus a bunch of custom code and various server settings.
To achieve awesome performance results requires a full WordPress SEO package: that’s what I’m looking to build for my possible new local SEO web design service: it’s why I’m reviewing the Astra theme to see if it could be part of the SEO package.
So far I’ve shown the Astra Themes WEBSITE is slow, not the Astra Theme per se is slow.
The next stage requires installing the Astra Theme on a clean WordPress install to see how it performs BEFORE adding speed killing WordPress plugins like Elementor.
Astra Theme vs Stallion Responsive Theme Performance Test
As I mentioned above I’ve developed an awesome WordPress SEO theme called Stallion Responsive (runs on this website) and have shown in a real world example (this website) it performs better than the Astra theme (the Astra Theme sales website).
This does NOT mean the Astra Theme is rubbish performance wise, it means whoever setup the Astra Theme website didn’t consider their Google Lighthouse Performance results as very important, they installed WordPress plugins which dragged performance/speed DOWNNNN!
Let’s look at a clean install of both the Astra and Stallion Responsive themes, if Astra can come close to Stallion it might just be worth testing on a real website with content.
My test environment is a multi-site version of WordPress, all this means is I can quickly generate sub-sites running WordPress in a /directory/ with everything identical other than the active theme.
So I have two identical WordPress test sites:
Astra Theme Test: https://classic-literature.co.uk/astra/
Stallion Responsive Theme Test: https://classic-literature.co.uk/stallion/
I made sure EVERYTHING was identical, even the number of words for the sites title and tagline are the same. The only difference is the URL and the words Astra and Stallion. There’s no Posts, Pages or Comments and I added only two widgets to the sidebar and one of them has no content.
They are as close to identical as possible.
Let’s test them in Google Lighthouse, you can run live tests from the URLs below.
Astra Theme Desktop Lighthouse Test: https://googlechrome.github.io/lighthouse/viewer/?psiurl=https%3A%2F%2Fclassic-literature.co.uk%2Fastra%2F&strategy=desktop&category=performance&category=accessibility&category=best-practices&category=seo&category=pwa&utm_source=lh-chrome-ext
Stallion Responsive Theme Desktop Lighthouse Test: https://googlechrome.github.io/lighthouse/viewer/?psiurl=https%3A%2F%2Fclassic-literature.co.uk%2Fstallion%2F&strategy=desktop&category=performance&category=accessibility&category=best-practices&category=seo&category=pwa&utm_source=lh-chrome-ext
Astra Theme Mobile Lighthouse Test: https://googlechrome.github.io/lighthouse/viewer/?psiurl=https%3A%2F%2Fclassic-literature.co.uk%2Fastra%2F&strategy=mobile&category=performance&category=accessibility&category=best-practices&category=seo&category=pwa&utm_source=lh-chrome-ext
Stallion Responsive Theme Mobile Lighthouse Test: https://googlechrome.github.io/lighthouse/viewer/?psiurl=https%3A%2F%2Fclassic-literature.co.uk%2Fstallion%2F&strategy=mobile&category=performance&category=accessibility&category=best-practices&category=seo&category=pwa&utm_source=lh-chrome-ext
For the record I’m having an issue on the server (new one planned soon), so the “Reduce server response times (TTFB)” are due to the SERVER, not the themes. Had the server not been playing up I suspect both Lighthouse results would be 100% for Performance: will retest next year…
Astra Theme Lighthouse Results
Astra Theme Lighthouse Results
Stallion Responsive Theme Lighthouse Results
Stallion Responsive Theme Lighthouse Results
I’m impressed with the Astra theme.
After testing the Astra Theme sales website I wasn’t expecting good results and certainly didn’t expect Astra to match Stallion Responsive.
So well done so far Astra Theme developers.
Ignore the “Reduce server response times (TTFB)” numbers, that’s my super cheap Godaddy VPS server: only cost me $200 a year and I have about 80 domains on it!
The SEO results don’t mean much either, Stallion Responsive includes an option to create meta description tags built into the theme, most users will install a WordPress SEO plugin like Yoast SEO or All In One SEO. It’s really easy to score 100 for SEO in Lighthouse.
You can see the lost Performance points is related to “Eliminate render-blocking resources“, this is an important issue and out the box neither theme completely eliminates render-blocking resources. Other than loading all CSS inline (NOT a good idea) this is difficult to solve at theme level: easy to solve with a plugin.
Astra Theme Eliminate render-blocking resources
With the Astra theme out the box there are 3 render-blocking issues, 2 of these are the themes CSS stylesheets.
…minified/style.min.css?ver=2.1.4(classic-literature.co.uk) 14 KB 110 ms
…minified/menu-animation.min.css?ver=2.1.4(classic-literature.co.uk) 1 KB 150 ms
…block-library/style.min.css?ver=5.3.2(classic-literature.co.uk) 7 KB 150 ms
Total size: 22KB, time delay 410ms
Stallion Responsive Theme Eliminate render-blocking resources
With the Stallion Responsive theme out the box there are 4 render-blocking issues, 3 of these are the themes CSS stylesheets.
…block-library/style.min.css(classic-literature.co.uk) 7 KB 70 ms
…colors/layout-310r.css(classic-literature.co.uk) 4 KB 150 ms
…colors/font-times-new-roman-times-serif.css(classic-literature.co.uk) 1 KB 150 ms
…colors/style-facebook-blue.css(classic-literature.co.uk) 4 KB 150 ms
Total size: 16KB, time delay 520ms
It looks like the Astra theme developers have split a CSS file related to menu animation into a separate CSS file. I do something similar with the Stallion Responsive theme, so I can have thousands of theme combinations in one theme I broke the main stylesheet into 3 files.
One CSS file for the layout, there’s 12 layout CSS options
One CSS file for the fonts, there’s 26 font CSS options
One CSS file for the colours, there’s 112 colours CSS options
It means in one theme there’s 34,944 different layout/font/colour scheme combination: it’s like having over 30,000 themes available on all my WordPress sites.
The disadvantage is it means there’s 3 CSS files loaded when it could be just 1 file.
This isn’t a ‘real’ performance issue on a proper website, we should be using a minification SEO plugin like W3 Total Cache to combine and minify as many CSS and JS files as possible, we should also have a plugin (W3 Total Cache again) which asynchronously loads the CSS and JS files. That’s why on this website I don’t have any render-blocking resources, W3 Total Cache has combined ALL the CSS files and JS files and loads them asynchronously: problem solved.
You can see from the Astra vs Stallion Responsive comparison eliminate render-blocking resources lists above, the Astra Themes CSS files are bigger than the Stallion Responsive Themes.
Astra Theme CSS File Size: 15KB
Stallion Responsive Theme CSS File Size: 9KB
The full numbers for everything loaded are under Diagnostics.
Astra Theme Diagnostics
Avoid chaining critical requests 5 chains found
Keep request counts low and transfer sizes small 7 requests • 37 KB
Stallion Responsive Theme Diagnostics
Avoid chaining critical requests 5 chains found
Keep request counts low and transfer sizes small 6 requests • 18 KB
Astra Theme Footprint: 37 KB
Stallion Responsive Theme Footprint: 18 KB
So Stallion Responsive has a smaller footprint.
Don’t take this as some sort of don’t use the Astra Theme because of 19KB of HTML and CSS code, that’s still a tiny footprint. I’ve worked for around 10 years making Stallion Responsive this good, so far I’m impressed with the Astra Theme. I’ve not done enough testing to use it for my local SEO web design business idea, but it’s a very positive start.
Before moving to a full on real site test I performed one more quick test.
GTmetrix Speed Test After HTML/CSS/JS Minification
As I mentioned above on a real website with content any half decent webmaster concerned about page speed will use a variety of WordPress SEO plugins to combine and minify CSS and JS files. Since in my earlier test Stallion Responsive had one more CSS file than the Astra Theme I wanted to compare the two themes AFTER the CSS files were combined together (both themes by default use minified CSS stylesheets).
I usually use the free version of the W3 Total Cache Plugin to combine, minify and cache WordPress sites, but I’ve found it can be glitchy at times: sometimes the combined/minified css file results in a 404 error page. Time to test other plugins, so installed the free Fast Velocity Minify Plugin.
I’ve not tried the Fast Velocity Minify Plugin before, so completely new to it, seemed easy to use and it output a combined/minified CSS file for both themes which was the main test.
I compared both themes in GTmetrix after HTML/CSS/JS Minification.
Astra Theme GTmetrix Speed Test After HTML/CSS/JS Minification
You can see from this GTmetrix speed test Stallion Responsive has a smaller frontend footprint.
Astra Theme GTmetrix Speed Results
- PageSpeed Grade A (100%)
- YSlow Grade A (98%)
- Fully Loaded time 0.7s
- Total page size 29.2KB
- Total # of requests 4
Those are very good page speed results.
Stallion Responsive Theme GTmetrix Speed Results
- PageSpeed Grade A (100%)
- YSlow Grade A (98%)
- Fully Loaded time 0.6s
- Total page size 16.5KB
- Total # of requests 4
Stallion Responsive is better, a little faster (144ms faster) and a little smaller (12.8KB smaller).
The difference between Astra and Stallion Responsive is minor. To put things into perspective adding a small image to the content and it’s going to be FAR bigger than 12.8KB and 144ms is a tiny delay. The majority of the size difference between the two themes is the size of CSS files, the Astra theme has a LOT more CSS rules vs the Stallion Responsive theme.
For the record although my Godaddy VPS is running slow (too many sites = too much traffic) it is still speed optimized. For those who are familiar with working on Lighthouse and other page speed test issues will have noticed a lot of the issues we normally see aren’t present in my test site despite a lack of other plugins.
This is because I took the W3 Total Cache Browser Cache .htaccess files rules from one of my WordPress sites and added them directly to the servers main httpd.conf file. Means every domain on the server has all the important file types cached etc… by default without having to install a plugin.
This wasn’t a real world test, next step will be installing both themes on identical websites with content and install the same plugins for full on performance SEO. That will mean installing a caching plugin like W3 Total Cache, a lazy load plugin like WP rocket Lazy Load etc…
Update: I didn’t test the Astra theme further, I tried out the Astra themes built in layouts (basically dozens of pre-built website layouts) and I didn’t like how it worked. For it to work it required a Page Builder Plugin and though you can build some interesting layouts for homepages etc… with Page builders they tend to be resource hogs! Many of the Page Builder Plugins require jQuery which I won’t touch due to how every version of jQuery is eventually found to have vulnerabilities and jQuery is bloated.
I started to rebuild Stallion Responsive, got a work in progress test site which I’m using for Plumbers Reviews and Plumber SEO Tests. So far have changed the design from fixed width (used to be fixed at 1,000px wide) to a fluid web design which fits better with mobile first web design.
David Law
Website - SEO Gold Services
