The cost of WordPress plugins on the performance of the editor

Performance metrics Building a performant editor is a very difficult task, it requires constant attention and monitoring to some key metrics. In the context of the WordPress block editor (aka Gutenberg), we constantly track the following key metrics: Loading time: The time it takes from the moment the user clicks the “new/edit post” link until …

Introduction to WordPress’s Global Styles and Global Settings

Building a website these days is all about finding the right balance between a coherent and consistent design across the website and customizations capabilities that allows specific content to shine. Far is the era where everything was customized manually (remember Dreamweaver and Frontpage?). CSS came to be, and different iterations on top of it, guidelines …

The WordPress block editor: a maintainer’s story

Writing software is easy, sustaining it for years is harder, and doing it for open-source software is a challenge. Here’s a story about my journey to help build the WordPress block editor from a maintainer’s perspective, a perspective probably invisible to most developers and contributors (unless you’re an open-source project maintainer). The fun part As …

Introducing BlockBook for WordPress

tl;dr: With BlockBook, you can build, test and showcase your static WordPress (aka Gutenberg) blocks in isolation. It can also be used to test the block styles of your themes. In short, it’s going to change how you develop and style blocks. If you’re a block developer, BlockBook is a must. You can see a …

Write as blocks in an encrypted collaborative environment

For WordCamp Europe Online Contributor Day, I’ve prepared a post to onboard new contributors. I’ve used notion.so for this. It’s great software, but a friend of mine rightfully commented about it being a missed opportunity to use Gutenberg. What if you could open your browser, type a URL,and immediately start typing in Gutenberg. and when …

Journey towards a performant web editor

TLDRThis post presents different performance improvement and monitoring techniques that can be used in any React/Redux application.Akin to the React Concurrent mode, it also introduces an async mode for Redux applications where the UI can’t be windowized. WordPress 5.0 included a new block-based content editor. The editor is built as typical react/redux web application with …

Embrace the modularity

The WordPress block editor is based around the idea that you can combine independent blocks together to write your post or build your page. Blocks can also use and interact with each other. This makes it very modular and flexible. But the Block Editor does not embrace modularity for its behavior and output only, it …

Let’s start building JavaScript plugins for WordPress

With Gutenberg, we made the choice to use JavaScript heavily in order build the UI of the editor, not because we’re nerdy hipsters but essentially because it is the perfect fit to address the UI and UX challenges of a heavily interactive interface in the browser. As a consequence, we’ll start to see a shift in …