Thoughts on Gutenberg (2020 edition)?

I’m really interested to know what the Roots community makes of Gutenberg now that things have had time to settle down a bit.

I saw this article on CSS tricks the other day and I get the feeling that a lot of people are coming around to the idea of gutenberg. I know that @ben is a convert and I have tried to get on board myself.

The problem for me is the lack of a sensible database architecture, which makes it really hard to use WordPress as a headless CMS for something like Gatsby JS. It is possible to just output the html on the frontend, but it would be so much better if we could easily provide our own React components for the blocks used in Gutenberg. There are valiant efforts to try to do this like here demo. I’m worried however that these solutions are just too fragile to rely on for client work.

I’m really attracted by the speed and security of JAMstack sites, but I also have a large investment in WordPress. Besides, clients love it and I don’t know of any other self hosted CMS that comes close in terms of flexibility.

I have toyed with the idea of using ClassicPress but I worry about future compatibility of plug-ins.

I’m now facing a stark choice for my business: forget the JamStack and go back to being a WordPress specialist, or ditch WordPress and embrace something like sanity.io and carry on with Gatsby for the frontend. Anyone else out there with a similar dilemma?

1 Like

@treb0r: Gutenberg is React based and can run standalone, you could use it separately from WordPress.
My own 2 cts here: Concerning Gutenberg and WordPress: I checked out the code/commits for Sage 10 branch and noticed that it caters to Gutenberg specific functionality. What I really like about WordPress is the stability and availability of fitting, affordable plugins. WooCommerce is an excellent OpenSource shop. The next PHP 8 release is promised to boost performance significantly with JIT. Yes, the backend in WordPress is messy with plugins adding new stuff and often not cleaning up (and not forced by spec or policies to do so). There is VersionPress which is beta now that tries to solve some of these issues, but its development seems to have stalled a bit. When I started developing with node, I first tried to use a JAMstack for everything over PHP, including online shops. I had been put off a bit by the extreme fast pace and breaking changes in nodejs and its libraries some years ago. Now I just want to get the site done. And with roots.io tooling I can apply app best practices and achieve very robust, (technically) “boring” sites and for most of the use cases this works just fine and for many years. I hope that the WordPress ecosystem keeps thriving and that the plugins I really like to use don’t rot away.

I like the way Gutenberg works, but I’m not interested in using it outside of WordPress. My big problem with it is how it stores the blocks in the db. The use of html comments makes it hard to expose blocks properly in things like GraphQL. I too like WordPress and the plug-in ecosystem but the fastest WordPress site still can’t compete with a Gatsby PWA. In a perfect World, blocks would be stored in their own table in the DB and everything would work nicely. For now it’s a case of accepting compromise. Either lose the speed and security of Gatsby and go back to WordPress, or lose WordPress, keep Gatsby and find another tool to handle the CMS. The third way is a potential solution that allows Gatsby to display Gutenberg blocks as React components. There is something in the works so we shall see.

@treb0r: The data aspect of Gutenberg bothers me also. Currently, I wrap Gutenberg blocks using an editor and a server-side filter so the stored markup is not “polluted” and the theme can easily change the wrapper and HTML. A middle-layer is missing in Gutenberg that easily allows this.

1 Like

Also interested in this! It looks like there will be a solution in a few months?

If I’m understanding it correctly, the gatsby-wordpress-gutenberg basically creates a middle layer by saving blocks as post meta?

1 Like

Not being cynical here - but how sure can we be that Gatsby is kept maintained for the near future? I am a bit jaded by all these ruby, js/node libraries that just rot now and don’t even work with newer node versions and other libraries.

I don’t think Gatsby is going to “rot” anytime soon. Gatsby is a company now (circa 2018), they have their own product based on their open source framework, and they have some of the brightest minds in the industry working with them. Further, they are really good at keeping their contributors engaged.

They are working on an impressive (if slightly hacky) solution that uses puppeteer to access wp-admin. This allows a real-time preview of the Gutenberg post or page in Gatsby preview. The preview is built using React components. The plug-in will ship with a full set of default block components that can be overridden (or shadowed) as required. This setup requires a local Gatsby development environment to be available. The plan is that the preview will also be available via Gatsby preview in Gatsby cloud for non technical users without a development environment.

This is the Gatsby business model - keep the software completely open source but charge for preview and faster builds in Gatsby cloud. They are working towards supporting incremental builds, which means that rather than needing to rebuild the entire site for every change (as is the case currently), only the post or page that has changed will be rebuilt.

The other exciting thing to note is that they are working on a brand new version of the gatsby-source-wordpress plug-in, This is being completely rewritten and will be based on wp-graphql. I’ve been using wp-graphql a lot recently and I can tell you that it’s great. They even have dedicated plug-ins that support ACF and Woocommerce that were once premium but are now open source and free to use.

They are also planning to release a new WordPress theme for Gatsby (a very different beast to a WordPress theme for WordPress) that will bring all sorts of WordPress goodies to the Gatsby party, including support for the WordPress template hierarchy and automatic WordPress routing. You can read about all this stuff on the Github epic here.

Gatsby has been a game changer for me - I love having the ability to keep WordPress secure behind extra security and then just using it for content management. I still use Bedrock and Trellis to manage it. It’s an easy sell to clients who already have a big investment in WordPress and are happy and familiar with the UX.

I was amazed to discover that Gatsby sites are not actually static at all, they are fully functional Progressive Web Apps built with React. This means that you can add dynamic features that fire off at run time in the browser, including updating pages or whatever. The fact that they are unhackable, fast and accessible is also great. My advice is to try building a Gatsby site and then run Lighthouse on it. With the right optimizations it’s possible (even easy) to score 100/100 across the board. Good news for SEO too.

1 Like

@treb0r thank you for the write up!! Does wp-graphql play nice with Gutenberg?

1 Like

Good question. Not currently. As I said at the start of this thread, the use of html comments to delimit blocks in the database means that it’s hard to do, but this new plug-in will/should solve the problem.

This topic was automatically closed after 42 days. New replies are no longer allowed.