Skip to content

Collaborative Code Editor (VS Code Live Share) — Simple#

Problem statement (interviewer prompt)

Design a collaborative code editor (VS Code Live Share / CodeSandbox multiplayer). Multiple users edit the same source files, share a terminal + debugger, and follow each other's cursors. Support large files (100k+ lines), syntax highlighting, and IDE integrations.

flowchart LR
  H[Host]
  G[Guests]
  SIG[Signaling]
  RT([Realtime relay])
  H --> SIG --> G
  H <--> RT
  G <--> RT

    classDef client fill:#dbeafe,stroke:#1e40af,stroke-width:1px,color:#0f172a;
    classDef edge fill:#cffafe,stroke:#0e7490,stroke-width:1px,color:#0f172a;
    classDef service fill:#fef3c7,stroke:#92400e,stroke-width:1px,color:#0f172a;
    classDef datastore fill:#fee2e2,stroke:#991b1b,stroke-width:1px,color:#0f172a;
    classDef cache fill:#fed7aa,stroke:#9a3412,stroke-width:1px,color:#0f172a;
    classDef queue fill:#ede9fe,stroke:#5b21b6,stroke-width:1px,color:#0f172a;
    classDef compute fill:#d1fae5,stroke:#065f46,stroke-width:1px,color:#0f172a;
    classDef storage fill:#e5e7eb,stroke:#374151,stroke-width:1px,color:#0f172a;
    classDef external fill:#fce7f3,stroke:#9d174d,stroke-width:1px,color:#0f172a;
    classDef obs fill:#f3e8ff,stroke:#6b21a8,stroke-width:1px,color:#0f172a;
    class H,G,SIG service;
    class RT compute;