Performance is one of the most important aspects of any website, but it’s something people rarely seem to take into account when buying WordPress themes. In this roundup we’ll take the ten best selling themes on Themeforest, in order of appearance, run them through some basic performance tests, and rank them top to bottom.
The Chosen Themes
ThemeForest’s list of best selling WordPress themes is updated weekly, but you’ll often seen familiar players holding the top spots for some time. We’ve taken the top ten (seen below) and pitted them against each other with some common performance tests.
There are many tools available for testing websites, we’ve chosen some classics: Google Pagespeed Insights, Webpagetest.org, Pingdom, and Chrome dev tools. Most will give feedback about how fast a web page loads, its overall weight, how efficiently its assets are piped over, ultimately giving some kind of score. We ran a demo of each theme through these tools and collated the figures (see table at the end of the post).
In addition to these tests we used the Accessibility Audit plugin for Chrome dev tools. This isn’t connected to performance as such, but the results always give an insight as to how a theme is built.
Some things to note:
- These demos are all hosted by the individual theme authors. Hosting specs are not all equal.
- A random demo was chosen where multiple options were available. WooCommerce, BuddyPress, or any other platform plugins were avoided where possible. No overtly image-biased themes (such as photography portfolios) were used either.
- All URLs were tested from California, where possible.
- Precise results may vary day to day.
- Theme demos are often built to make a visual impact, filled with high quality imagery and as much functionality as possible. This means that demos are rarely an accurate reflection of how a resultant website might look and behave. It’s probable that, with your own copy, you would better the performance scores of all these demos.
- Pagespeed insights mobile: 46%
- Pagespeed insights desktop: 48%
- Webpagetest.org: Straight A’s, except for a big fat F on image compression. AAAFA☑
- Pingdom: 91% (A grade)
- Pingdom load speed: 1.94 s
- Chrome dev tools page weight: 2.8Mb
- Accessibility audit: 94% score (excellent). ARIA attributes follow best practices, elements are well structured, meta tags used properly.
Heavy images are a huge contributor to the low pagespeed insights score; 77.2 % of the page weight being attributed to images. Files such as
avada-creative-home1.jpg could have been reduced from 344.6 KB to ~40 KB without much effort. Certainly fair to say that, with common sense, your own install of Avada could be made much lighter and faster. Good to see that Avada is built with accessibility in mind.
- Pagespeed insights mobile: 64%
- Pagespeed insights desktop: 91%
- Webpagetest.org: A’s across the board. AAAAA☑
- Pingdom: 68% (D grade )
- Pingdom load speed: 1.51 s
- Chrome dev tools page weight: 1.3Mb
- Accessibility audit: 83% score (not bad). Some image elements are missing
altattributes, color contrast ratio could be better on some of the text (relative to its background). But on the whole, elements are well structured and accessibility is solid.
- Pagespeed insights mobile: 76%
- Pagespeed insights desktop: 87%
- Webpagetest.org: Straight A’s AAAAA☑
- Pingdom: 98 (A grade)
- Pingdom load speed: 1.27 s
- Chrome dev tools page weight: 1.8Mb
- Accessibility audit: 80% Falls short on contrast ratios (this is quite a dark, broody theme), and its imperfect use of ARIA roles.
This theme loads very quickly. Lots of its visible content is prioritized by including essential styles inline in the
head, and much of what’s loaded in is minified and concatenated. As is often the case, images account for the lion’s share of the page weight (69.5%), so it wouldn’t be difficult to get this demo’s homepage under the golden 1Mb threshold.
- Pagespeed insights mobile: 63%
- Pagespeed insights desktop: 68%
- Webpagetest.org: FAABF☒
- Pingdom: 80% (B grade)
- Pingdom load speed: 2.34 s
- Chrome dev tools page weight: 2.5Mb
- Accessibility audit: 94% (excellent). Properly used attributes on elements, including ARIA roles. Discernable element names and well described content.
Whilst the load speed of Impreza’s restaurant demo isn’t bad, its performance scores are hindered by over 2Mb of images. Also of note are the lack of CDN and the poor server response time; two aspects which are specific to the hosting of this demo and ones which you can easily improve.
- Pagespeed insights mobile: 60%
- Pagespeed insights desktop: 60%
- Webpagetest.org: AAADB☒
- Pingdom: 70% (C grade)
- Pingdom load speed: 2.79 s
- Chrome dev tools page weight: 5.2Mb
- Accessibility audit: 89% One of the higher-scoring theme demos for accessibility, showing an underlying strength in its build quality.
Again, no CDN used for hosting of this demo, which loses it a few points on webpagetest.org. A lack of HTTPS might also have earned Enfold a black mark. As usual, this demo falls into the trap of being as visually stunning as possible, sacrificing page weight for image quality. At over 5Mb this is the heavyweight of the bunch, but image size is always something easily remedied.
- Pagespeed insights mobile: 77%
- Pagespeed insights desktop: 74%
- Webpagetest.org: DFAAB☒
- Pingdom: 87% (B grade)
- Pingdom load speed: 2.45 s
- Chrome dev tools page weight: 2.1Mb
- Accessibility audit: 91% A very healthy A11y score, let down only by a lack of
altattributes on some images, low contrast ratio on some areas (this church theme is quite muted) and absence of a
titleattribute on an
iframe. Still, given that the iframe is from a YouTube embed, which doesn’t come with a title attribute as standard, we’ll forgive that oversight.
This demo is one of the few which does a reasonable job keeping image overheads down to a minimum; webpagetest awards it a solid 97/100 for image compression. Instead, its lowly scores come largely from the hosting; no CDN, no HTTPS, poor initial response time, and a lack of “keep alive”–otherwise known as a persistant HTTP connection, something which can easily be switched on. As ever, easy improvements that you yourself could bring into effect.
- Pagespeed insights mobile: 70%
- Pagespeed insights desktop: 83%
- Webpagetest.org: DAAAF☒
- Pingdom: 85% (B grade)
- Pingdom load speed: 2.12 s
- Chrome dev tools page weight: 1.6Mb
- Accessibility audit: 91% (very good). Small points bringing the overall score down, but ARIA attributes follow best practices, and page elements have discernable names, describe their content well, and are properly structured.
One of the lighter demos here, but image sliders are always going to crank the page weight up, even with well optimized images like these. Minifying HTML and other assets would have helped the pagespeed insights score, and improved hosting would again do wonders–better server response time, a CDN, and caching being low-hanging fruit.
- Pagespeed insights mobile: 53%
- Pagespeed insights desktop: 57%
- Webpagetest.org: AAAAA☑
- Pingdom: 96% (A grade)
- Pingdom load speed: 1.02 s
- Chrome dev tools page weight: 3.7Mb
- Accessibility audit: 83% Points lost on the A11y front by failing to name buttons correctly (the WooCommerce wishlist icon buttons can’t be read properly by screenreaders) and some links are equally vague. Low contrast on some elements and duplicated element IDs are also easy fixes.
Not seen through favorable eyes by Pagespeed Insights, though the other scoring metrics absolutely love Flatsome! Good hosting serves the page efficiently (theme authors take note), assets are minimized, and lazy loading images help what would otherwise be a mid-weight page load progressively.
- Pagespeed insights mobile: 38%
- Pagespeed insights desktop: 44%
- Webpagetest.org: AAAFA☑
- Pingdom: 92% (A grade)
- Pingdom load speed: 1.07 s
- Chrome dev tools page weight: 3.3Mb
- Accessibility audit: 91% (very good). Owing to the impactful nature of the graphics (which I love, by the way), text upon some of the images makes for weak contrast ratios. The page structure and descriptive use of elements, along with proper ARIA usage all make up for the contrast shortcomings.
I’m going to sound like a broken record here, but five minutes of image optimization would vastly reduce the overheads on this demo.
home-bg-08.jpg alone weighs in at nearly a whole megabyte; running it through TinyPNG shaves off 87% straight away. Why wouldn’t you? As Pingdom and Webpagetest suggest, most other performance aspects are very good.
- Pagespeed insights mobile: 76%
- Pagespeed insights desktop: 77%
- Webpagetest.org: AAAAA☑
- Pingdom: 93% (A grade)
- Pingdom load speed: 1.19 s
- Chrome dev tools page weight: 1.5Mb
Great scores across the board, standard improvements apply (image optimization, JS and CSS compression/concatenation) but bear in mind that this demo also comes furnished with a large pull-out promoting other versions of the theme (added complication which your own version would be unlikely to need). Without much effort this demo could step into the sub-1Mb weight class.
Table of Results
Bearing in mind all the caveats we’ve listed along the way, this table puts the themes in some kind of order. Pingdom’s rating serves as a fairly round score to base things on; you’ll see that page weight, load speed, and even Pagespeed Insights scores fall into a similar pattern (to a degree).
|Pagespeed Insights (average)||Pingdom||Load Speed||Page Weight|
How to Make Your WordPress Themes Faster
Having purchased a WordPress theme, how could you optimize it?
It won’t surprise you: an easy first port of call when optimizing your website is your images. Remove unwanted images, compress those you do need, save JPEGs as “progressive” (so that there’s at least something to see while they’re loading) and you’ll be off to a good start. You may also want to install a Lazy Loading plugin to take things a step further. We’ve seen that very few of these demos prioritize image optimization, but that at least means you’ll be able to improve on their scores.
Regarding the notoriously fickle Pagespeed Insights scores, you’ll have noticed that all these demos (with the exception of one) score better for desktop than their mobile versions. This no longer reflects the way the web is used, so to keep Google (and users) happy give careful consideration to mobile performance. A mobile first attitude will also help your SEO.
<head> and make your website usable as quickly as possible by preventing “render-blocking” scripts from slowing down the load process. If the slider at the top of your homepage requires the whole page to be loaded before it shows up, Google will penalize you.
Beyond that, consider your hosting. Enable GZIP compression. HTTPS won’t do any harm either. Use a caching service too; installing and configuring W3 Total Cache is child’s play. Use a CDN if your content is intended for a wide audience. Lastly, take a look at these tutorials and courses for more details and help on the subject:
WordPress Performance Resources
- Optimize Your Website Without AMP by Kezz Bracey
- Why (WordPress) Performance Matters by Rachel McCollin
- Speeding Up WordPress by Barış Ünver
- Optimizing Google PageSpeed to 100 in WordPress by Jeff Reifman
- How to Use WordPress Plugins Without Hurting Performance by Barış Ünver