Exercise · Communication

Collaborative Whiteboard

Whiteboard exercise. Try the problem cold, then reveal the rubric to self-score.

Out of 10 points45 min whiteboardReference solution →
01

Prompt

Infinite canvas. Shapes, text, freehand drawing. Multiple users see each other's cursors in real time. Undo/redo, zoom/pan, offline edits that sync when reconnected. Like Miro or FigJam. The hard parts: a CRDT for canvas objects so concurrent edits merge without conflicts, spatial indexing so a canvas with 100K objects only sends the ~200 in your viewport, and per-user undo that reverses your operations without undoing other people's work. Scale: boards with 100K+ objects, 50+ simultaneous editors, sub-100ms collaboration latency.

Time budget: 45 min whiteboard. Draw architecture, estimate numbers, discuss tradeoffs.

02

Hints (progressive — click to reveal)

Hint 1

Lead with CRDT, not OT. "Each canvas object is a CRDT register — concurrent edits merge without a central server." This immediately signals you know modern collaboration architecture.

Hint 2

Spatial indexing is the scalability key. "R-tree query returns only viewport objects" — this is what makes 100K-object boards feasible. Most candidates miss this entirely.

Hint 3

Per-user undo is non-obvious. "Undo applies the inverse operation as a new CRDT op" — this shows you've thought about multiplayer undo deeply, not just single-player Ctrl+Z.

03

Rubric — 10 points

  • +2 Lead with CRDT, not OT. "Each canvas object is a CRDT register — concurrent edits merge without a central server." This immediately signals you know modern collaboration architecture.
  • +2 Spatial indexing is the scalability key. "R-tree query returns only viewport objects" — this is what makes 100K-object boards feasible. Most candidates miss this entirely.
  • +2 Per-user undo is non-obvious. "Undo applies the inverse operation as a new CRDT op" — this shows you've thought about multiplayer undo deeply, not just single-player Ctrl+Z.
  • +2 Cursor optimization matters at scale. "Viewport-filtered, 15 Hz with client interpolation" — shows you understand the network cost of presence features.
  • +2 Distinguish from Google Docs. Docs = linear text (sequence CRDT or OT). Whiteboard = spatial objects (map CRDT with LWW registers). Different data model, different indexing strategy.

Self-score: tally the points you would have mentioned unprompted. 7+ is interview-ready on this problem.

04

Red flags (things that tank the interview)

  • Send all 100K canvas objects to every client on load
  • Use OT (Operational Transform) instead of CRDT
  • Global undo stack — undo reverses the last operation on the board by any user