LayerStudio

The Challenge

Real-time collaboration and canvas performance pull in opposite directions: every remote edit invalidates local state, while a 60fps canvas cannot afford to re-render the world on each change.

The DOM was not an option for documents with thousands of vector nodes — rendering had to move to the GPU without giving up accessibility or text quality.

The Solution

The document is a CRDT, so concurrent edits merge deterministically without a locking server. Each client applies remote operations to a normalized store, and a dirty-rectangle scheduler repaints only the regions that changed.

Rendering runs on a custom WebGL pipeline with instanced drawing for repeated shapes. UI chrome stays in React, synchronized through a thin Zustand layer.

Outcome

Sessions with five concurrent editors stay under 16ms frame budget on mid-range hardware. The CRDT layer removed an entire class of sync bugs that had dominated the backlog of the previous prototype.