Website builder performance comparison

I created a similar website in 11 different website builders and analyzed each site with Lighthouse.

MetricDescription
Perf, BP, A11Y, SEOLighthouse scores for Performance, Best Practices, Accessibility, and SEO
FCP, FMP, SI, TTILoad timings for First Contentful Paint, First Meaningful paint, Speed Index, and Time to Interactive
CPUTotal CPU usage during page load
Page Size, JS SizeTotal page download weight and download weight of JavaScript code.
NamePerfBPA11YSEOFCPFMPSITTICPUPage SizeJS Size
Yola797969903.2s3.3s5.1s3.3s0.9s0.6MB0.1MB
Wordpress.com6493911004.0s4.0s6.5s4.1s0.5s0.5MB85KB
Weblium619381902.5s2.5s7.9s5.5s1.1s0.3MB0.3MB
GoDaddy548681905.0s5.0s5.7s5.5s0.6s0.3MB0.3MB
Site123528669914.4s5.0s6.6s5.5s0.6s0.7MB0.3MB
Strikingly515769911.2s1.2s4.7s13s2.0s1.8MB1.2MB
Jimdo468673915.4s5.4s7.5s5.4s0.4s0.4MB0.2MB
Webnode46861001005.7s5.7s6.7s5.7s0.7s0.8MB0.1MB
Weebly447184904.8s4.8s8.0s6.0s1.2s1.1MB0.4MB
Squarespace419377915.7s5.7s8.6s5.7s0.8s1.0MB0.4MB
Wix328674914.3s4.3s5.3s13s2.8s1.6MB1.1MB

Interpreting the table

First of all, note that the table above is sorted by the Lighthouse performance score. Lighthouse heavily penalizes JavaScript execution, and Time to Interactive is the metric with the greatest impact on the performance score. Accordingly, sites that load and run a lot of JavaScript code do more poorly in this test.

However it's worth considering some other metrics. For example, the First Contentful Paint indicates when the user first starts seeing content. Speed Index indicates how long it takes for the page to become mostly visually stable.

What makes sites built with website builders slow?

Unlike custom-built websites, website builders face a special problem: their developers don't know what the final page will look like. It might be a simple static website with a contact form. Or there might be a blog or a store, or both.

Because many layout elements need to be supported a lot of unnecessary code is loaded. While ideally only the necessary modules should be loaded, this requires more architecture work for the makers of the website builder.

Adding to this each page element needs to be renderable in the site editor, and it's not always easy to split out the editor code from the code for the published site.

Ensuring a quick first contentful paint

The first contenful paint happens after loading the initial page document when there are no more render-blocking elements. For example, a script tag or a stylesheet can delay the first contentful paint.

In order to achieve faster paint times there should be as few render-blocking elements as possible. Ideally the initial document request contains all the necessary styles for the initial render. If that's not possible, avoid long cascades of requests that depend on each other, and avoid extra network roundtrips.

Monitoring the performance of your website

I'm building a website monitoring tool called DebugBear, it's what I used to collect the data for this analysis. It regularly loads your website, tracks Lighthouse scores and performance metrics, and then presents the results in a way that allows you to take action. Give it a try!

© 2019 DebugBear Ltd