Block Protocol Project Aims to Create Universal Block System, May Collaborate with Gutenberg

Block Protocol is a new project that aims to build a block system for embedding interactive blocks in any web application. The goal is to create a more interoperable and open web where these blocks can be shared through a standardized protocol. The initial draft of the Block Protocol spec is being incubated by the team at HASH, an open source data, modeling, and simulation platform.

When HASH founder Joel Spolsky shared the idea with the world yesterday, through a post on his WordPress-powered blog, it caught Matt Mullenweg’s attention.

“This is 100% what Gutenberg is trying to do, and it’s designed to not be WordPress-specific, with the idea that Gutenberg blocks become cross-CMS,” Mullenweg said. “We have open source Android and iOS versions.” He recommended the Block Protocol team link up with Gutenberg lead architect Matias Ventura to discuss combining efforts.

Mullenweg touched on this vision during the 2021 State of the Word address, saying this was one of the reasons the project pursued dual licensing for Gutenberg.

“I just wanted to note that the WP apps don’t need the dual-licensing–they’re already GPL (AndroidiOS),” mobile developer Matt Chowning said during the dual licensing discussion with contributors in early 2021. “The motivation for the change is to broaden Gutenberg’s usage to the vast majority of apps that are not GPL like the WP apps and to grow the community using and contributing to Gutenberg.”

Mullenweg recast this vision during the State of the Word, saying he would like “Gutenberg blocks to become a standard that is larger than just WordPress.” He sees Gutenberg as “something even bigger than WordPress:”

There is a Drupal version of Gutenberg, et cetera. But I think part of that is that its blocks can become standard across every proprietary system. I make fun of Wix. I think it’s fair. They’ve earned it, but if they adopted Gutenberg, I would toast them and take them out to beers. I think that would be awesome.

Gutenberg is something even bigger than WordPress, which is basically saying how do we edit and create the web? And can we get as many people, both proprietary and open source collaborating on that as possible? So that is a bet we’ve made. Maybe it’s correct. Maybe it’s incorrect. I hope that you, as a contributor still are excited about being part of Gutenberg.

Projects like Drupal Gutenberg and the Gutenberg Cloud, which shares CMS-agnostic blocks across both Drupal and WordPress, were among the first to demonstrate that this idea could work in the real world. The Drupal Gutenberg module received an enthusiastic reception at Drupal Europe in 2018 after representatives of Frontkom, the Norwegian digital services agency that ported it over to Drupal, unveiled their work at the conference.

“It is key for us that Gutenberg stays decoupled from both CMSs as a library, and our hope is that Gutenberg core devs will catch onto the vision of Gutenberg as the ‘editor for the open web’ — not just for WordPress,” Frontkom CIO Per André Rønsen said after the event. Shortly after the launch of Gutenberg Cloud, Gutenberg engineers reaffirmed their commitment to keeping the architecture platform agnostic.

In 2019,  Maurice Wijnia, a developer at Van Ons, an agency based in Amsterdam, created Laraberg as an easy way for developers building applications with Laravel to integrate the Gutenberg editor. In many cases, Gutenberg usage outside the WordPress ecosystem is implemented to give clients a more friendly way to manage their sites.

The Block Protocol has its own technical objectives that go beyond getting cross-platform adoption of the same blocks. It also includes this idea of block data moving between apps:


The protocol provides standardized, guaranteed methods of bidirectional communication between blocks (user-interactable components) and embedding applications such as web-based, desktop, or mobile apps – in a secure, permissioned fashion. By making it easy to extend functionality for different data types, it allows users to edit data in one block and have the update reflected in other blocks (or applications), each providing useful functionality.

Practically speaking, this means that a user could potentially create a block in a to-do list app and then move that data into a kanban board block on another application, without relying on an API integration. This frees up data from its application of origin and makes it far more portable and interoperable.

The Block Protocol also aims to give developers access to a global registry of reusable blocks so they can embed them in their own applications. The protocol enables developers to pass structured data between applications.

Block Protocol’s quick start guide recommends building blocks using React but it says the team will be releasing examples of how to write blocks using different frontend libraries in the near future. The Block Hub has examples of blocks they have already built.

When WordPress was developing its Block Directory, the Gutenberg Cloud team encouraged them to make it a CMS-agnostic library of blocks, but the Block Directory is still strictly tied to WordPress’ infrastructure.

“A more ideal approach however, would be to merge the two efforts,” Rønsen said in 2019. “The key for us, is to make the infrastructure open to other communities, not just WP developers. We are happy to put our project in the hands of the WP core team – given that they share the same open vision.” This didn’t end up happening, which is why Gutenberg Cloud is still the only place distributing cross-platform Gutenberg blocks.

“Because it’s all 100% open, we hope that the Block Protocol will become a web standard and commonly used across the Internet,” Spolsky said in his announcement.

Block Protocol may have more success with distributing blocks that can be used anywhere on the web, since interoperable blocks are the main thrust with this project. The project is open to working with existing block editors whose creators want to contribute to the new standard. Gutenberg combining efforts with Block Protocol has the potential bring a better authoring experience to web apps around the world while also giving users the ability to easily move their data between apps.

📻 WP Tavern Jukebox
🎙️ Host: Nathan Wrigley

4 responses to “Block Protocol Project Aims to Create Universal Block System, May Collaborate with Gutenberg”

  1. Thanks for covering this, Sarah.

    I think the Block Protocol project can be a great opportunity to formalize and standardize the world of Blocks and I’d love to see it merged with / being used by the Gutenberg project.

    Would be a great opportunity, as you write, to expand Gutenberg beyond the world of WP.

  2. The most important thing that comes to my mind, reading the Block Protocol docs, is how they focus on blocks as paradigms for content types (implemented by React (like Gutenber), Vue or Web components), while Gutenberg has so far ignored structured content, leaving folks to turn to 3rd party plugins like acf, pods, toolset, etc. Integration of Gutenberg with Block Protocol could be a big deal in rectifying the horrific omission of in-core content type management in Gutenberg so far.

    • What do you mean by “ignored structured content”? Isn’t the attributes definition quite close to what Block Protocol calls a schema?

      "attributes": {
          "textAlign": {
              "type": "string"
          },
          "content": {
              "type": "string",
              "source": "html",
              "selector": "h1,h2,h3,h4,h5,h6",
              "default": "",
              "__experimentalRole": "content"
          },
          "level": {
              "type": "number",
              "default": 2
          },
          "placeholder": {
              "type": "string"
          }
      },
      

      versus
      “properties”: {
      “color”: {
      “type”: “string”
      },
      “editableRef”: {
      “type”: “object”
      },
      “level”: {
      “type”: “number”
      },
      “text”: {
      “type”: “string”
      }
      },

Newsletter

Subscribe Via Email

Enter your email address to subscribe to this blog and receive notifications of new posts by email.

%d bloggers like this: