This repository aims to explore block interactivity patterns with the goal of absorbing as much complexity as possible from the final developers.
It's not a goal to do an in-depth analysis of the patterns, only to experiment with them in a controlled environment to assess their potential and then test them in the Gutenberg repository, where we will see if they are a good fit or not.
-
🎨 WordPress Directives Plugin
- Main branch:
main-wp-directives-plugin
- Tracking Issue: Tracking issue: WordPress Directives Plugin 🎨
An installable plugin that adds a set of basic directives and client-side navigation.
- Main branch:
-
🧩 Custom Elements Hydration
- Main branch:
main-custom-elements-hydration
- Tracking Issue: Tracking issue: Custom Elements Hydration 🧩
This hydration method is based on custom elements (
<wp-block>
) that hydrates isolated islands. It interconnects those islands through synchronized bridges for APIs likecontext
,Suspense
orErrorBoundary
. - Main branch:
-
⚛️ Directives Hydration
- Main branch:
main-directives-hydration
- Tracking Issue: Tracking issue: Directives Hydration ⚛
This hydration method is based on the creation of a static virtual DOM from the root, where only the interactive islands are replaced by P/React components. It behaves like a single P/React application.
- Main branch:
If you want to use these experiments on your blocks, they will need:
- To have a
block.json
file. - To be registered on the server.
- A single node wrapper.
Feel free to clone this repository and inspect the code, open issues, submit PRs, suggest features or ask questions!
And if you are doing any other frontend-related work, please leave a comment in this Make Core post.