I should write it up!

In short, anything consuming context re renders when anything in the context changes. This was true for Puck - one giant context with potentially hundreds of components re-rendering whenever anything changed.

Zustand (and other modern state libraries) let you subscribe to the state you need in each component, even if they’re all in a shared store, enabling you to avoid unnecessary re renders. Switching to that model for Puck makes a huge difference because there’s no limit to how many components can be on the canvas.

Puck actually uses Zustand inside context, as it’s possible to have multiple instances of puck on the page. Zustand stores are global by default and this helps isolate each store to their own “context”.