
In the marketing hoopla for Etch you will get to hear Kevin Geary talk about “era 4 in page builders”. Kevin’s view of the “eras of page building” is interesting and worth considering. He talks about era 3 as effectively “reaching the limits” of what is possible with a UI and how in his view era 4 is a move towards a kind of hybrid development environment where the UI supports development, but where code is also available. There are aspects of this breakdown that I agree, but I come to a vastly different conclusion about what it means.
When I last heard some guy (who I won’t name because he seems like a polite and decent guy) bragging about how “everything is UI-based now in dev, and people with no coding experience can just do everything with an editor” I reacted about the same way as many others. Bewildered. As somebody who codes everyday and who makes UI’s that generate code, I view the no/low code as a market opportunity. However I also know that it takes upwards of 50K lines of professionally written code to empower non-coders to do basic things with a UI. I would describe the accurate % of capability of low/no code as being somewhere around 1-1.5%. Meaning whatever I can do with code, you can do 1.5% if you’re really, really advanced with your editor of choice. And that’s great. I’m glad you’re willing to buy tools, study docs, maybe even dedicate your career, to mastering 1% of a craft. You are what I would describe as, very special indeed. So no, I’m not in the camp of “UI’s can do everything, why bother coding”. In my experience in 23-years of site development I have never seen a project worth over 1M that didn’t meet the following criteria:
I will clarify that of course I’m not saying individuals cannot build basic websites, nor am I discouraging hobbyists or learners in any way. People start sites for lots of reasons aside from commercial, although how often somebody really wants to build site “just for fun” is a little bit questionable. Playing around with web dev may be fun for a few hours, but is it really fun when you’re hundreds of hours into it and you have a long list of bugs and issues to fix? The fun can definitely wear off. We’ve seen this for instance with Lovable, in one single month they lost nearly 50% of their entire user base. Why? According to most reports it was simply that people had tried it because it was fun to watch AI spit out partly functional stuff, but then most people realized this game is boring… there are no points, there is no levelling up, it’s just the same thing over an over again. Very boring game. And good luck trying to make 1 single penny from something you generate from AI. Why would that have any value?
Back to the “eras of page building” idea. To me this is the evolution of page builders (at least in WP specifically):
Thank you for reading the introduction to my post. I just realized now that I have not actually mentioned Block Bindings or the Interactivity API yet. My bad. How do these API’s affect the future of page building in WordPress? Both involve working with dynamic data. They work in very different ways, and while they have some overlapping use cases they are designed to solve different problems. What they will do in reshaping the marketplace for page builders is that they make “dynamic data” free. It may have taken a long time, about 9-years if you go right back to the origins of Gutenberg, but they are at or near the game changing moment where the support for dynamic solution in the editor is equal or greater than any other tool. From my perspective as a developer, Gutenberg already vastly surpasses anything else in the market in this specific category.
The data sources aspect of Block Bindings is well designed. It makes it possible to access and feed any data, including arbitrary data or remote fetched data, into the editor where blocks can access it. It won’t be long until every single plugin that has data will feed it through data sources into the editor. Every single column from the WP database can also be fed into the editor through data sources, although core might not decide to support this kind of blanket coverage. Is a list of passwords from the user table a good idea anyway? But you get the point, if you know a bit of PHP you can make a SQL query, call a function to create a new data source and bam, you have just integrated that data into the editor. Currently the support from core blocks in accessing that data is relatively weak, but expected to increase in 7.0. More important longer term however is that every block kit and anybody building blocks, can make their blocks bindable and the core does provide a UI. Making bindable attributes is not that difficult (achievable for a moderate level dev), and although AI isn’t trained on this now with some context provide it’s not impossible to vibe code a custom block with binding support. The UI is really the crux in making this all accessible and fostering adoption. Developers, mostly 3rd party commercial devs will handle providing the sources and the blocks. Having the UI from core means consistent and immediate capacity without any tedious or costly work that would slow down adoption.
Then there is the Interactivity API. If you haven’t used it as a developer you might think of it as being mainly for effects or animations etc. And while it can be used to replace front-end JS that in WP is still often jQuery based, that’s not the only monumental innovation in the interactivity API. The use of interactivity revolves around “stores”. Not only can stores hold functions that might run an animation or process the click from a button, but just like in React land, stores can be thought of as “data stores”. They can house and make data available via context. And this makes them huge problem solvers. Because when you want to build sophisticated modern interfaces, you need to solve the ever-changing nature of data. The old school handling of data found in PHP-oriented templating is “load it, render it”. That’s it. Need to change it? Write jQuery or custom vanilla JS. Not great, in fact I feel great pain if there are any humans on the planet still doing that. Not only is it very limiting to layer JS on top of what is effectively “dead rendered markup”, but it’s actually far more work to write small JS solutions in such a situation than it is to learn React. And for me personally, I went with the “learn React” approach and today nothing is faster for me than building UI’s in React. But that doesn’t mean we should build everything in React. There is still no way (so far?) to build create a composable approach to building a UI, and have it rendered out in React. One could in theory build “React rendered Gutenberg blocks”, which is something I once experimented with, but it is very, very tedious. By nature, React requires a build process. On the other hand one of the most important aspects of React is available via the Interactivity API, and that is “reactivity”. React may have a similar name, but it does not own the concept of “reactivity”. This is the capability of having pieces of the DOM bound to the state of the application. In practice this means the user creates a new record, and the grid table updates to show the new record. And it does this not because a developer manipulated the DOM to insert the new record, which would be an error-prone and very cumbersome bit of code to write, but instead the table is showing a list of records it access via state, and the state has now been updated. And this means everything in the UI include the count of records is just “magically” (reactively) updated in an instant.
Although the Interactivity API doesn’t have a UI aspect to it, developers can leverage custom blocks to output reactive elements. They can also trigger store creation. As a simple example you can have a parent loop block that fetches data and loops over the child blocks. The child blocks can then be bound to the data store. This is a powerful alternative to block bindings. It not only leverages the power of dynamic data, but it adds in application style UI capabilities. As a result you may soon see WordPress interfaces that look like React apps, but are built instead with the Interactivity API.
Now before touting this too rigorously, I’ll repeat what I wrote earlier which is to me as a PHP/React dev, it’s still vastly faster for me to just work directly in React. So my go to for building a UI for my own site will still tend to be React because I can just build it, enqueue it into my custom WordPress theme. I could go headless if I really wanted to wander around without a head. I view headless in the same category as GraphQL… interesting theory, now prove it. It works for some, but again my case despite working with React heavily I see no point to trade in the very consistent functionality of WP routing and structure for headless which comes with tonnes of new costs and problems that I don’t have with a React-based WP theme. The challenge to building a UI entirely out of blocks is that it still takes a lot of planning around how those blocks will interact and form a structure. There are a lot of questions to answer about how far you go in making the blocks flexible. What styling options to include? Provide fixed styles or dynamic options or?
The limiting factor in Gutenberg adoption for layout use in my opinion is the same as it was several years ago and will never change. People want that “wow I can make useful stuff” reaction when they open it. And it doesn’t have that, because to have that you need 100% CSS coverage. You can’t dabble in styling. You can’t have “a few carefully selected” options. At least, I don’t think that is the way. Maybe it can be, if it’s at the level we see in some of the commercial block kits where they manage to cross the threshold into “matching professional designs”. Right now, I suspect most agencies that use blocks just either make custom blocks so they can style them as needed, or ship separate style sheets. The lack of a coherent “style management system” in Gutenberg is unfortunate. It perhaps belies that in the shorter term the editor was a “work of the ecosystem” but in the long haul, only devs are going to be able to understand it and keep it going. Thus it ends up having “brilliant engineering” and “terribly styling”. The “vast arctic wasteland” design concept for Gutenberg is also widely hated by nearly everybody, and for some reason never changes despite millions of requests for dark mode, or at least some eye drops for every unfortunate soul forced to use the damned thing.
Wait was this supposed to be a pro-Gutenberg article? Well I do really hate using it. I’m using it right now, and it hurts my eyes. At least I’m using it for writing, and in my view it is great for writing. I actually prefer writing in Gutenberg over the Google Drive docs that I actually pay monthly to access. And it is objectively better than Google docs given it has slash-based inserting, and only recently Google added something similar but much weaker.