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.