Gutenberg's Faster Performance Is Eroding Page Builders' Dominance – WP Tavern
Sarah Gooding
WordPress’ block editor, colloquially still widely known as Gutenberg, is making inroads into the segment of users who have heavily relied on page builders for years. For the most part, page builder plugins have either declined in growth or stagnated in 2020, with the exception of Elementor. In contrast, block collections with page builder features are gaining more users. Performance is becoming an important factor in this migration.
In a post titled “Damn. Gutenberg Smokes Elementor,” Kyle Van Deusen published benchmarks from his experience building a simple landing page using Elementor and then Gutenberg.
“Like any Elementor user, I’ve become increasingly anxious about the future of Elementor and just how bloated it is,” Van Deusen said. “I think Google PageSpeed Insights agrees.”
After recreating the same design with Gutenberg and GenerateBlocks, Van Deusen saw a small difference in GTMetrix scores.
He found the most profound difference when testing with Google’s PageSpeed Insights, where Elementor scored 46% on mobile, and 83% on desktop.
“Because I’ve had such poor luck getting any kind of decent scores with Elementor sites (especially on mobile), I’ve given up using this tool,” Van Deusen said. “Not because it’s not a valuable metric (in fact, it may be the most valuable since this is how Google sees things), but because there wasn’t much I could do about it.”
In contrast, the page built with Gutenberg gave him a 94% score on mobile and a 99% on desktop.
“In terms of performance, straight out of the box; Gutenberg absolutely smokes Elementor,” Van Deusen said. “However, each time I’ve taken Gutenberg for a spin, I’ve left frustrated. As soon as I feel like I’m getting the hang of it, eventually the wheels come off and I’m back to installing Elementor.
“But when your PageSpeed Insights scores go from 46% to 94%, it’s time to perk up and pay attention.”
Van Deusen said it took him more time to recreate the design in Gutenberg and he had trouble with mobile views. At the moment, he doesn’t see switching as an advantageous move for his business.
“While I think we can conclusively say, at least for performance, Gutenberg is the clear winner — it’s just not at a point where a guy like me can jump ship,” Van Deusen said.
“Gutenberg is fun to play with, and I enjoy dreaming of the day when it’s viable for me— but I like to put food on my table. Elementor still helps me do that more efficiently.”
In another experiment, WordPress developer Munir Kamal rebuilt Elementor’s homepage in Gutenberg to compare the HTML markup both page builders generate. The page built with Elementor includes 356 div’s in the markup vs 77 for Gutenberg. Kamal found that Elementor generated 796 lines of code vs Gutenberg’s 206 lines, resulting in a difference of 99kb vs 28kb respectively.
In August 2020, DearHive, the makers of the DearFlip WordPress plugin, left CodeCanyon to sell plugins from their own site. DearHive’s company site was built with Elementor, but suddenly Google ranking mattered for their product site now that they were selling independently from CodeCanyon. Deepak Ghimire, a software developer at the company, cited performance as the chief issue that impacted their ranking and drove them to switch to Gutenberg.
“Our page speed went from 83 with Elementor to 98 with Gutenberg,” Ghimire said.
Page builder plugins may still have more features at this point in time, but performance is becoming a critical consideration for those who are doing business online. In May 2021, Google plans to introduce a new ranking signal for Search, based on page experience as measured by Core Web Vitals metrics. Performance is an important part of delivering the kind of scores necessary to pass the Core Web Vitals assessment. This ranking signal update from Google may compel even more site owners to migrate away from slow page builders.
For the past two years, WordPress users have been asking if Gutenberg will replace page builders. It looks more and more likely if the most popular ones remain bloated alternatives and the smaller ones keep on the same trajectory of attrition. It won’t happen overnight, but it is bound to accelerate when full-site editing makes its debut in WordPress core.
For those who build websites for clients, the best way to future-proof your skills is to learn how to build pages within the framework of the block editor and, if you can, learn how to build custom blocks. It’s also a good time to be experimenting with different block collections to streamline your setup so that you don’t have to sacrifice high performance in order to build sites efficiently.
I can’t remember the landing-page guru who joked that a perfect “simple landing page” was a button that says “buy now.” But, even after you add other necessary features, landing pages are perhaps the second simplest design challenge after simple blog posts.
I’m sincerely looking forward to when you can make the same claim about complex, non-cookie-cutter homepage and inner pages that are professionally designed to companies’ branding guidelines. Without firing up a SASS/SCSS compiler and dozens or hundreds of extra media queries. Modern page builders still do that better than Gutenberg. Until the dev team stops bragging about minor accomplishments and actually starts paying attention to what page builders are actually useful for we’re going to wait forever. The wait’s becoming more and more annoying.
Yeah, honestly, I am more than happy to give Gutenberg its due; there’s a lot that’s going right and it’s clearly a big effort. But there are so many variables in play I am more concerned with just picking what works for a given task than whether or not one or the other might hypothetically be prudent.
Elementor has a lot of bloat, but for me it makes sense, and yeah, there’s a sunk cost in putting so much time into being fluent with it that I don’t want to backtrack. But it’s also more intuitive to me than Gutenberg, and if my brain doesn’t work in a Gutebergy way, it’s less of a complaint or praise about either platform than the pragmatic aspect of, well, I need to get work done.
People dump on the Gutenberg team like crazy and I feel bad about that, and I get that you can’t be responsive to everyone’s needs — especially when that means a bunch of conflicting ideas. But on the whole they seem like they wanna do what they wanna do regardless and other people weighing in might just be a happy accident.
Since more than just the team has to use it, I am not sure that’s a great approach. Even Elementor gets that criticism. You can’t say what category a post is in in the post widget but they have flashing police sirens and stuff ahead of that because they say their feedback is more about design-heavy things rather than more functional/informational stuff.
I have to listen to my client’s needs as well and after however long it’s been it’s not like, “Oh well it’s new and people don’t wanna hop on what’s new.” It’s been there for a while and through repeated attempts people always ask for it to come off. Which seems silly because it’s not like they love the WYIWYG of a classic editor.
To me the problem is less “what can compete with page builders” and more of “this specific way of handling an alternative to them.”
If I can be 5% less performant but the production and maintenance is 5X easier, I’ll take the latter every time. Yes, even when reports and stats come out about sales lost to load time, because I’d also be losing sales not being able to use my website in the way that I want.
Really bias article. All my sites load under one second with Elementor even with slot of JavaScript. If you read that article it loads 100 KB, which is not even visible
To the human eye.
The same logic is like 25 g of protein is better than 24 g of protein. But hey it’s your blog
Really, under 1 second is pretty darn good for any site using wordpress with any page builder. What host do you use?
Is the block editor actually the one responsible for eroding the page builders market dominance? I haven’t seen any proof of that and I doubt that’s the case. Correlation is not causation. Maybe there’s some other factor responsible for the growth stagnation of page builders.
The fact is that the block editor — without considering the use of add-ons — has lots of terrain to cover before being a true substitute for page builders, as the author of the first post pointed out.
Building pages with Gutenberg is very frustrating and Gutenberg can not beat Elementor in terms of features and ease of use.
Anyway after reading this post I’ve decided to develop simple websites for my clients with Gutenburg.
I don’t really have anything against GB. If you are proficient with GB, that’s one thing. However, will you be asking those clients what they think of GB before you build? Of course, that question is only relevant if the site is turnkey.
Hello there,
I Would say that, as Kyle Van Deusen said in his article, even though Gutenberg seems faster, “it’s still not there”.
Because as much as we need a website to be fast, we also need to save time on making it, and not the contrary (which would be the case with Gutenberg).
It’s promising though so let’s see what comes next!
I for one am very happy this is happening. Every time I decide to do some contracting on WordPress sites, I almost immediately regret it. Each site has a unique page builder that has somehow broken something over an update that I have to then figure out and fix. Or maybe it’s a combination of some plugins that don’t work well together with the page builder, and that has broken. Not to mention most page builders have quite frankly horrific usability, so yes, please let Gutenberg eat away at that market.
Compare to Elementor, Gutenberg at this time is really time consuming. It needs me 8 hours to replicate a homepage made with Elementor. But what a result ! 500 ko instead of 1 mo and 700 ms to load instead of 3 sec !
I think 2021 will be the year of Gutenberg.
And remembre that Classic Editor will give an even faster site than Gutenberg :-)
It’s funny that a few years ago nobody would have thought that Gutenberg would become a competitor of pagebuilder. It was just said: “Gutenberg is just a text editor…”.
And suddenly it is a topic! The question is not if, but when the pagebuilders have to take a new path.
I personally prefer to work with Gutenberg for normal pages, only when I have to work with custom fields and want to design them nicely, Elementor comes into play for me. But I think that will also be possible with Gutenberg at some point…
It makes sense. Gutenberg outputs much cleaner markup, and, unless all blocks are dynamic (which aren’t by default) there are much fewer requests to the database as all blocks are kept in the posts’ table.
Also, as a developer, you have much better control at which asset to load compared to a page builder.
If GB was meant to supplant page-builders, then it would seem that WordPress has set out to eat its own children. Who in the WP eco-system decided that GB would be the end-all? If GB was originally meant to “replace” TinyMCE, why didn’t the GB devs just perfect that?
On the other hand… Are there any statistics on how many WP users install the Classic Editor plugin?
You can not do with Gutenberg what you are doing with a page builder. For low budget sites, of course Gutenberg is an option, but if you need something more advance, I think you need a page builder
For now Elementor and DIVI are more powerful than Default Gutenberg.
I say Gutenberg is getting updates at a faster clip than Elementor and Gutenberg though which is key.
I personally think Gutenberg is an embarrassment and poorly executed. I remember being at Wordcamp US in 2017 when Matt really started to promote Gutenberg at the State of the Word. At the time we were building most of our websites using Divi and we just started to work with Elementor. After that State of the Word I felt like page builder days were numbered and WordPress was going to force everyone to use Gutenberg.
Here we are in 2021 and in my opinion Gutenberg isn’t even close to where Divi and Elementor were back in 2017. Since then, every few months I will try to use Gutenberg and it blows my mind how slow they are to add basic features that every page builder has had for many years.
One of the biggest reasons I don’t plan to use Gutenberg is because it’s nearly impossible to train our clients on how to use it. We build all our client websites with Elementor and we give them custom training videos on how to make edits to their website. I would never hand over a Gutenberg website to client and try to train them. It would be embarrassing and honestly I think the clients would be disappointed that we build their website on Gutenberg. Will we be using Elementor forever? Of course not, but as of right now in 2021 Elementor is the best option for our agency.
One of the biggest reasons I don’t plan to use Gutenberg is because it’s nearly impossible to train our clients on how to use it
What?
I’ve been using the Block Editor professionally for the past 2 years and had no problems in training customers. All of them are able to change contents, create new pages, use the blocks we provide in new manners that we didn’t even think of when originally creating the page.
Especially with the Gutenberg versions 8.x and 9.x the block handling can be a super smooth experience. If you know what you’re doing. And even non-tech-savvy customers get to that point quickly in my experience.
Funny. Our clients are more and more starting to ask us to build their new site with Gutenberg as content editor. In terms of usability, I really don’t see what’s difficult to handle with Gutenberg. But of course this is depending on how much you want to do. If Gutenberg is just being used for content editing, I think it’s seriously easy to understand.
If you want to use Gutenberg for designing an entire page, it’s not doable, for now. I’m looking forward to the Full Site Editing features. I feel like Automattic is really up to pace now, and making a lot more progress than other companies like Divi and Elementor. Sure, Gutenberg is behind on almost every aspect, but for how long?
Always hard to find out what those numbers really mean.
In a real world scenario, we are talking about cached and (pre-) compressed pages. Do the numbers reflect that? If not, what would real numbers be? For example it does not make much sense to compare uncompressed file sizes.
It’s not page builders vs Gutenberg. Page builders are plugins, some replacing the editor with their completely own interface, some are based on on the block editor.
“Gutenberg” is not only the core blocks, an interface and API for content creation, including page builders that provide blocks and block manipulation.
Tools for content creation should not slow down the front, or else, they are bad.
A very important goal when starting with the block editor, and finding the best suited page builder tool for it, is the removal of the hated shortcodes, for UI and performance.
The problem with Divi, Elementor and friends is that the interface are proprietary, not standardized, and – seems to me – lock you in much harder than a block based page builder.
I see both Divi and Elementor are introducing blocks and stuff to be compatible with the WP block editor framework (aka Gutenberg). This is probably the way things are going, more integrated and compatible – even with each other.
As, when WP is finally getting multilingual support – also part of Gutenberg project, the multilingual plugins will have to adapt, and the result is they will be more compatible with each other.
To be clear, Elementor is not the only pagebuilder that grew users in 2020. The article linked at the top singles out Elementor for its “exponential growth” but it says that 2 other pagebuilders grew this year: BoldGrid and PageLayer.
Sincere question (I’ve never used or even tested a pagebuilder in 12 years with WP):
Can it be that any decline in other pagebuilders may be due to leaving WordPress for another solution? Is it known that the people abandoning pagebuilders are choosing Gutenberg over another non-WP solution?
I can’t even get people to notice the one button that you use to add something to the page. It’s just a plus icon with no attention drawn to it. Why not make it a focal point if it’s the start of the entire process?
Or you start with a paragraph block and type /. Which in my experience makes creating new blocks at the right spot extremely easy.
For Non techs like me, Gutenberg is Fun it is so simple and very intuitive while writing big Posts.
I am so fed of Divi problems that the day i will feel Gutenberg full site editing will give me same results ‘Visually’ as “Extra theme (Divi Magazine theme) and Their Fluidic theme builder. i will ran away from Them.
WordPress for me always meant simple and clean & Gutenberg is wordpress future i think.
The headline is completely wrong. What’s eroding page builders’ dominance has nothing to do with performance and everything to do with Gutenberg being the default on WordPress.
It’s like saying, back in the day, Internet Explorer was the best browser because everyone is using it. Everyone was using it because it was included in every version of Windows since 95. Needless to say, Chrome changed all that.
Anyway, that all said, there’s no fighting Gutenberg. It’s here to stay and, thankfully, it’s also getting better and better with each release.
I hate that Gutenberg is forced on us in the admin panel; I usually just want a simple text editor.
But I love that I can see a future in which Gutenberg will obliterate the existing page builders. I haven’t used any page builders which didn’t make me shudder whenever I looked at what they were doing with the page code.
Hey Sarah! Robby from Beaver Builder here. Proud to report that we’re seeing healthy growth here as well. We launched the free version of Beaver Builder at a time when it was really difficult to place an image next to text on a WordPress page. Nowadays, Gutenberg has done a great job of bridging that gap.
BB is running on over a million active sites and we take that responsibility seriously. We prioritize quality and customer service over growth. Our team made major improvements to the performance and accessibility of our outputted markup last year and we have more coming.
As Gutenberg is being used more seriously as a front-end design tool, a lot of the problems we’re solving over here apply to Gberg users too. We’re excited to keep bridging that gap with our new-ish plugin, Assistant! 🙂
Robby, Beaver Builder is getting a bad rap here on this thread for the following reason: I ran some speed tests, comparing Gutenberg to popular builders and themes, and Beaver Builder performed virtually the same as both Twenty Nineteen/Gutenberg and Genesis. To be honest, I was very surprised by the results! After running those tests, I switched from Divi (which is dreadfully slow by comparison) to Beaver Builder and haven’t looked back. I’m able to generate 90+ mobile scores on Google Pagespeed with BB and not worry about Gutenberg’s lack of feature parity!
Basically the only “builder” that lost market share is WP Bakery ?
Beaver grew, Elementor grew, BoldGrid and PageLayer grew, Oxygen probably did (and oxygen is very fast!), too.
Absolute position & scroll effect is one of missing feature in Gutenberg compared with other page builder
If Gutenberg was better than third party page builders, it would make onboarding new clients easier.
Fewer competing tools and integrations to worry about.
This is not the case- yet.
Perhaps page builders will become block editors in the future or just an interface for creating blocks.
Gutenberg is not even Wysiwyg yet. Page Builders are still better user experience.
WordPress needs to focus on making better options than third parties, rather than replacing options just for the sake of it- or to push their own roadmap ahead of the ecosystem.
If Gutenberg is better than a Page Builder, more people will use it naturally.
TLDR: the takeaway from all of this is that Gutenberg is still NSFP
I’ll stick with classic editor and siteorigin
I am an elementor user and until Gutenberg can complete with customization, I can’t see making the switch.
Full site editing is on the horizon, but how long before it is really ready for production sites.
The fact that Gutenberg creates cleaner code is definitely intriguing, but as far as design capabilities I still think its a long way off.
That being said, the looming page experience update in may is definitely on my mind and I’m seeing fully loaded speeds at 1.2 seconds even using Elementor with my current setup using flywheel hosting.
Don’t get me wrong, I still have pages that need improvement. You need to be able to pass all 3 web vitals for a rankings boost and not every page does.
I think Gutenberg has potential and will be looking into using it for new builds in the future.
Have been using Gutenberg to build couple of brochure site and WooCommerce site, so far is good.
But it sill can’t beat the ease of use of Elementor. Would said I spend 2-3x more time to build with Gutenberg.
As for page speed, it all depends how you build your site. You can get pretty bad score if you don’t build properly.
Actually this is the way to go with WordPress. Drop page builders, become a friend with Gutenberg. Serious speed boost.
I do not know if there are any real developers here to share their point of view, so I will. I am full-stack developer, experienced in PHP, Javascript, CSS, WordPress API, React and of course Gutenberg, although I did work with other page builders. I create custom themes and plugins. Gutenberg gives me capability to prepare easy admin part, with blocks tailored to customers needs. In the end, developed solution is much easier for customer (not so much options as in page builders), adapted to their level of requirements and of course, much faster than with other page builders as described here.
I also found custom tweaking (I mean changing code – Javascript, PHP, CSS) with page builders more cumbersome than with Gutenberg. I think Gutenberg really excells for customer who hires experienced developer.
Interesting post. The fact is I wanted so much Gutenberg to make all these page-builders go away (my first encounter with such was WPBakery, wich was upsetting me so much… glad it’s fading away). Still, at this moment, I do use SiteOrigin (post loop) and Gutenberg, and in certain occasion, it’s perfect. But the moment you need to have div.row>div.col-lg-6*2 working correctly, Gutenberg is still a touchy tool.
Nonetheless, I’ve spend the last week playing around with Blocksy, a theme made of Blocks and built with Gutenberg, and oh my! It’s really something that I’ll focus on: themes made of reusable blocks…
Enter your email address to subscribe to this blog and receive notifications of new posts by email.
WordPress Tavern is a website about all things WordPress. We cover news and events, write plugin and theme reviews, and talk about key issues within the WordPress ecosystem…
© All Rights Reserved. Powered by WordPress, hosted by Pressable
source