In the age of WordPress, there have been some blazingly fast innovations in terms of page builders. Putting WordPress aside for a second, nearly every platform like Wix, Squarespace, and others, has made building websites easier than ever with WYSIWYG page builders (What You See Is What You Get). One of the big benefits of these types of page builders are the ready-made blocks and website elements, with various settings, so you don’t have to manually code, padding, text size, color, accordion menus, and many more.
While page builders have opened the door for website creation to be within reach for non-developers, there is a potential consequence to this. Let’s take a look at the following example:
This is a snippet of code from a website with Elementor installed. Elementor has paved the way in easy, drag and drop page WordPress builders, and is one of the most popular and easy to use on the web. You can see in the yellow highlighted text that ‘Elementor’ appears all over the place in the code. Whether this has an effect on page speed we will get to momentarily. But there is no doubt that page builders do increase the HTML and CSS size, which means more KB to transfer, larger file sizes, and large DOM (Document Object Manual).
Core Web Vitals June 2021
In June 2021, Google finally fully implemented its Core Web Vitals as a ranking signal. This was highly anticipated, resulting in SEOs scrambling for at least a year before to prepare websites for the “new” ranking signals.
- LCP is the element (usually an image, video, or block of text) that’s the largest and most noticeable element on the loading page within view. A passable score is <2.5 seconds
- CLS is the quantitative measure of how much elements shift as they load on the screen. A passable score is < .1
- FID is the first feedback the end-users receive at all from the page server. A passable score is <100 milliseconds
Google has determined that the Core Web Vitals are the most important measurements of website speed, out of a long list of general Web Vitals.
Since so much time has gone into improving page speed across multiple platforms using different technologies, the question that now should be asked is: is all of this worth it?
Beaver Builder vs Elementor vs Brizy vs Gutenberg
We analyzed the 4 most popular free page builders on WordPress
Gutenberg is the smallest and most simple page builder that takes advantage of WordPress blocks to style the page.
Elementor, Brizy and Beaver Builder are more advanced with more options and hypothetically create larger page sizes. It’s worth mentioning that Elementor and Beaver Builder are ‘extremely’ popular.
The SEO Page Builder Test
So naturally, we did what any curious SEO would do (or should do), we ran a test comparing the four.
So how did we do it?
- We took a brand new fresh install of WordPress.
- We used one of the most popular free WordPress themes on the market: Astra
- We found a hotel theme template for Astra that was compatible with all 4-page builders so it was as fair of a test as possible.
- We did not install any additional plugins or make any edits at all. (This means we did not use Yoast, RankMath, any Cache or Speed plugins nor anything else.)
- The site used SSL and was hosted on Hostinger.com, an inexpensive shared hosting plan.
- However we did install WP Reset, a plug-in that reset the entire WordPress install, and we deactivated it before each run. (We chose this plug-in to reset WordPress to avoid an accumulation of media and pages when we imported the theme and page builder for each test.)
We predicted that Gutenberg, being the lightest of the page builders, would result in the fastest page load time and best Core Web Vital scores.
But for many companies, the Gutenberg builder is more challenging to use. For an average person, this means it takes more time and experience to set up a page than it does with Elementor or Brizy, which in turn means more $.
So the ultimate question was: How carefully do we need to be when choosing our page builders?
Let’s take a look at the Page Speed test results:
- Gutenberg – 88
- Beaver Builder – 80
- Brizy – 79
- Elementor – 73
The breakdown of the Results for each is as follows:
|FCP: 2.6||FCP: 2.8||FCP: 2.8||FCP: 3.2|
|LCP: 3.3||LCP: 4.3||LCP: 5.4||LCP: 4.1|
|TTI: 3.0||TTI: 3.6||TTI: 5.1||TTI: 3.7|
|CLS: .062||CLS: 0||CLS: 0||CLS: 0|
It’s quite clear that Gutenberg did in fact do the best, with Beaver Builder not far behind. Next came Brizy and finally Elementor. (It should be mentioned Elementor has produced a full YouTube playlist for speed optimizations that can be done). Each passed and failed in different metrics, but to be perfectly honest…all of these scores are ok (but not great) and of course, there is room for improvement. Out of the box, with no other optimizations, this score is above average. It’s important to note that the theme template was for a hotel rental website, so it was image-heavy and visually advanced.
If we want to go according to the metrics, our hypothesis was correct that Gutenberg was the lightest of free page builders and resulted in the highest scores.
But does it really matter?
As any SEO would say…. It depends.
In our opinion with the little weight that Core Web Vitals actually plays in Google Ranking, these results are not enough to initiate a complete overall change of a page builder.
With each page builder, there is a learning curve that requires time and $. Plus the migration process itself requires time and resources.
SEO is a combination of many, many small signals and optimizations that can potentially show big results. But it seems in this case that changing page builders (out of these options) might not be the best use of resources.
If Elementor, Brizy, or Beaver Builder are easy and comfortable for you to use, and allow you to design and publish your amazing content quickly and easily, then stick with it!
It should be noted there are heavier paid page builders like WPbakery and DIVI that could impact speed scores even more. If this is the case, then careful consideration should be used to determine the cost-benefit of a change.
It’s also important to consider the scores of your competition. For example, it’s known that B2B websites often load far slower, and since most clients are on desktops, speed time matters less. But for competitive industries, the scores could vary, and the ultimate consideration always comes back to user experience.
Is your website easy and attractive for your users? If the answer is “yes,” then think twice before changing page builders or themes. If the answer is “no”, then a careful plan of action should be created to improve the UX of your website.
We would not advise you to change the page builder on your website if you’re happy with your website as a whole, and if the speed is above average. If you decide that you’re in need of a fresh start all around, then changing your page builder can be beneficial to you and should be considered. The choice is up to you and the needs of your website, and only you can make this decision.
Yes, you can pass Core Web Vitals easily using the Elementor page builder. Although the scores are a little higher than with no page builder, they do provide is a solid balance between ease of use and performance.
Both Beaver Builder and Elementor are popular page builders for WordPress. They each have their own strengths and weaknesses and both can enable your website to load quickly, when optimized correctly. Our load speed tests did show a slightly higher score for Beaver Builder.
Yes and No. Page speed Insights provides a score based on lab data, meaning machines simulating reality. What is important is the field data. Real results from real people using your website that Google collects via Chrome. The most important metrics to look at are CLS, LCP, and FID. But the general score is a great indicator to reveal areas for improvement.