Related:
Web page layout – with CSS flexbox and Bricks
Website Mockup Size Guide
Responsive Sizing System using CSS Clamp
We recently switched from Elementor to Bricks builder. Although the switch was inevitable, due to the centrality of a website builder in our work it was not a decision we took lightly.
But then again – given what we learned about Bricks during our research which pitted Bricks vs Elementor – it was ultimately the best thing we could have done, and a very easy decision to make.
Because the web itself is constantly growing and changing, web editor software is inherently prone to being superseded by something newer and better every few years. We’ve changed website builders many times, but never have we been so glad we did.
In this article we’ll explain why we’re excited about this change, and – since Bricks will be the backbone of your website – how you will benefit as a client.
What is a page builder?
A page builder – sometimes known as a website builder – is a toolkit which assists a developer in creating websites, usually much more quickly than manually coding an entire site from scratch. It does this by providing a tactile, visual interface which allows dragging, dropping, and editing elements on the page. These elements can be chosen from a kit consisting of items such as:
- Heading
- Text block
- Image
- Button
- Icon
- Video
- Tabs
- Accordions
- .. and many, many more
Many page builders, including the ones we use, sit on top of WordPress. WordPress is a content management system, a type of software package which lets you create and edit posts, pages, menu items, and media such as images and documents.
Apart from Bricks, some examples of WordPress page builders are Elementor, Divi, Beaver Builder, Oxygen, Breakdance, Cwicly, Generate Blocks, Visual Composer, and WordPress’ own builder, Gutenberg.
Bricks vs Elementor: a comparison
What is Elementor?
Elementor is by far the world’s most popular page builder. They achieved this through an excellent interface, a wide range of elements (known as widgets in Elementor), fairly good performance (at least when it launched in 2016), a very large ecosystem of third-party widgets, and an excellent, if somewhat aggressive marketing campaign.
Elementor rapidly started gaining popularity in 2017, and reached a peak in late 2022. It is thought that Elementor is running on nearly 10% of ALL websites.
(Source: W3Techs – Usage statistics and market share of Elementor).
Cracks start to show
Over time, however, their rapid expansion and enormous market share became their achilles heel. If you scratch beneath the surface of an Elementor web page and look at the source code you’ll notice that it’s not very efficient. There is excessive nesting of elements: boxes within boxes within boxes. Similarly the naming scheme of these boxes is confusing and excessive.
This is most likely due to the legacy code base they’ve had to maintain to prevent old Elementor websites from becoming incompatible with newer methods, such as changing from rows and columns to flexbox containers.
What developers really wanted was a leaner, clean, fast builder that could rapidly build highly-efficient websites. A number of lean, sturdy newcomers arrived on the scene fill this gap.
Instead of improving their core product – admittedly an almost impossible task given the backwards compatibility requirement of their ever more cumbersome product – Elementor responded by adding even more bloat, such as AI features and web hosting, perhaps in order to dazzle beginner developers.
Elementor started rapidly losing ground in 2023. They have a very long way to fall, however, and Elementor will reign supreme for many years to come. This is not entirely a bad thing. Elementor is a good product for the masses, and it arguably inspired some excellent alternatives for professional developers.
What is Bricks?
Like Elementor, Bricks is also a page builder or website builder. In fact at a quick glance their dashboards might appear fairly similar. The learning curve to switch from Elementor to Bricks is therefore fairly shallow.
However Bricks has some crucial differences in terms of its developer-friendliness. It features ingeniously-implemented systems – such as interactions, conditions, pseudo-classes, and class management – that work alongside proper semantic approaches to writing code, while at the same time making these features completely unobtrusive so that a relative beginner would not find Bricks too much of a challenge.
Bricks is a relative newcomer to the scene, starting its ascent in around May 2022. At the time of writing (February 2024) Bricks is gaining in popularity at an exponential rate, beating several other earlier newcomers, most notably Oxygen and Breakdance.
Why change? And why Bricks?
The world-wide-web is one of the fastest changing technologies. As a result, web design and development software has come and gone at a much faster rate than software in other areas, even related ones. For example in the image editing field, Adobe Photoshop has been around since 1990 and remains best-in-class. In contrast every few years another web editor bites the dust.
Not that we’ve had much choice, but we’ve grown very accustomed to change. We keep a close eye on emerging technologies and change our preferred website builder when a clear winner emerges, which seems to happen every 4 years or so.
A brief history
- In 2011 we switched from custom hand-coded or Dreamweaver websites to WordPress, using either pre-built or custom themes, sometimes with Visual Composer page builder.
- In 2013 we switched to the Genesis Framework + Dynamik Website Builder combo.
- In 2015 we switched to Beaver Builder, then a hot, new kid on the page builder block.
- In late 2019 we switched to Elementor when it became clear that its features and ecosystem would enable us to build a superior product.
- In late 2023 some newcomers – most notably Bricks – started making Elementor look very clunky by comparison.
The full list of reasons we decided to switch to Bricks would require a detailed technical explanation which we may elaborate on at a later stage, but we’ll provide a quick overview for now.
Being more of a developer-friendly page builder, Bricks doesn’t necessarily even try to pitch itself as a direct competitor to the huge, populist Elementor, however many developers are switching from Elementor to Bricks for reasons that might be considered crucial to the core philosophy of the web.
Performance
The most significant benefit of Bricks is performance, both when editing websites, but also in terms of page load speed, a very important factor from an end-user point of view.
When editing websites, Bricks builder utilises VueJS – a very modern, slick JavaScript framework – under the hood to make the editor perform extremely fast. The Bricks editor never crashes, which was a common problem with Elementor.
On the front end, Bricks achieves its brilliant performance by generating extremely minimal, efficient code. This, unlike Elementor which generates large quantities of unnecessary and very inefficient code.
Bricks builder also utilises HTML and CSS in a proper, semantic way. Developer Kevin Geary explains how in detail here.
Also very significant when discussing Bricks builder and performance is the fact that – unlike all other page builders – Bricks is not a plugin. BRICKS IS A THEME. This means that Bricks’ code runs very “close to the metal”. There are fewer “moving parts”, other builders requiring both a theme and a plugin.
The Bricks builder philosophy
Bricks was created by German developer, Thomas Ehrig. While an initially-small development team might have caused concerns about their ability to delivery, Ehrig’s singular focus combined with his total transparency with the Bricks developer community has allowed Bricks to develop as if it were built by a much larger team. Additionally the core Bricks team has grown, and continues to maintain a very dynamic relationship with their user base.
The Bricks builder community
One of the primary influences on our decision to switch to Bricks was the large number of highly-respected giants in the WordPress developer community who started not only enthusiastically endorsing Bricks, but are generously contributing to Brick’s community forums on their website and in their Facebook Group.
Developers such as Sridhar Katakam (BricksLabs), Kevin Geary, WP Tuts, Web Squadron, WP Easy, to name a few have all become devotees of and highly-valuable contributors to the Bricks builder community.
The Bricks builder ecosystem
Similarly the ecosystem around Bricks is growing rapidly, and thankfully in a way that protects Bricks’ developer-oriented advantage.
Elementor by comparison made some unfortunate decisions early on which they are now unable to change without breaking many existing websites and affecting compatibility of the vast array of add-on packs in their third-party ecosystem.
The Bricks ecosystem has fewer add-on packs, and more offerings of frameworks which work alongside Bricks to extend it, and hence they don’t restrict Bricks’ roadmap and growth.
While Bricks lacks the vastness of Elementor’s ecosystem of 3rd party widget add-on packs, Bricks’ elegantly built-in features often eliminate the need for anything extra. And in any case, since in our workflow we avoided Elementor add-ons in the first place, this doesn’t really apply to us.
Most of The Crocoblock suite which we sometimes used with Elementor is compatible with Bricks. Furthermore, Bricks has some of Crocoblock’s features, so there’s less of a need for it.
What does this mean for you?
Our change to Bricks has some benefits for you, our valued client, although some benefits will not be immediately apparent. Let’s start with an obvious one which reaps benefits down the line.
Lifetime updates
Bricks – at time of writing (February 2024) – offers a lifetime license, which we eagerly purchased. This was huge. This means both unlimited websites (everyone) AND unlimited time (forever). This is of particular benefit to our clients since they don’t ever have to purchase a license to keep Bricks updated!
More stability when updating
Because of the simpler, more semantic, and much more elegant structure of Bricks’ generated code and their aforementioned independence from their own ecosystem, Bricks can be safely updated to newer versions without wrecking the front end or causing websites to crash. The same cannot be said of Elementor which often requires manually updating parts of custom-written code.
Faster development turnaround time
Bricks’ fast-loading, rock-solid, elegantly-designed, and very powerful builder allows us to build websites faster, and hence more affordably for you. Additionally – thanks to Bricks’ powerful features – we are less reliant on costly third party add-ons.
Faster loading time
Bricks’ simpler, more elegant front end code means your website will load much faster, often without additional caching plugins.
Better SEO
Load speed is a big ranking factor, so Bricks already has an edge there. Their clean, semantic markup is loved by search engines like Google and Bing.
Our enthusiasm
Our job satisfaction is a big part of what keeps us going. Using exciting and powerful tools such as Bricks helps us inject passion into our work, and take pride in delivering a finished product which really shines.
Until we switch again ..
We’ve been here before – switching tools – and we will undoubtably switch again when Bricks is superseded by something else. But if something is going to beat Bricks, then the future is looking bright because Bricks is already pretty amazing. We’re looking forward to the year ahead, especially working with you and Bricks.
Happy 2024
ps. What about Elementor? We aren’t leaving our Elementor clients behind. Our Elementor client’s websites will carry on working just fine, In fact this very website is built with Elementor.
Related:
Web page layout – with CSS flexbox and Bricks
Website Mockup Size Guide
Responsive Sizing System using CSS Clamp
Table of Contents
