The Challenge

Building a real-time collaborative whiteboard sounds simple: people draw on a canvas, changes sync to everyone else. But the devil is in the details.

Architecture

WebSocket Server

We used a Go server with gorilla/websocket. Each board is a room — clients join a room and broadcast operations to all other members.

Operational Transform

For drawing, we used a last-write-wins strategy. Each stroke has a unique ID and timestamp. When conflicts happen, the most recent stroke wins.

Cursor Presence

We broadcast cursor positions at 30fps with throttling. Each client renders other users' cursors as colored dots with name labels.

Key Lessons

1. Throttle everything — Broadcasting every mousemove will kill performance
2. Handle reconnection — WebSockets drop. Your app should recover gracefully
3. Optimistic updates — Apply changes locally first, then sync
4. Binary protocols — For canvas data, consider Protocol Buffers over JSON

The Result

The final product supports 50+ simultaneous users on a single board with sub-100ms latency.