← Back

How We Built Real-Time Collaboration

A deep dive into the technical architecture behind live cursors and collaborative editing in our workflow canvas.

The challenge

Real-time collaboration sounds simple until you try to build it. Multiple users editing the same workflow simultaneously creates complex synchronization problems.

What happens when two people move the same node? How do you handle offline edits? How do you make it feel instant?

Our approach

We use CRDTs (Conflict-free Replicated Data Types) for the core data model. CRDTs guarantee that concurrent edits always converge to the same state, without coordination.

For the networking layer, we built on top of Liveblocks. It handles the WebSocket connections, presence, and room management so we can focus on the product.

The architecture

Client A ──┐
           ├── Liveblocks ── CRDT Store ── Postgres
Client B ──┘

Each client maintains a local copy of the workflow. Edits are applied locally first (optimistic updates), then synced through Liveblocks to other clients.

Presence

Live cursors are separate from document sync. We broadcast cursor positions at 60fps using Liveblocks presence. This gives the feeling of working together in real-time.

What's next

We're working on comments, version history, and branching. Imagine treating workflows like code—with pull requests and merge conflicts.

Analytics consent

We use Google Analytics and Hotjar to understand conversion and product usage. Accept to enable measurement. Decline to keep them disabled.

Privacy policy