SevyDevy

Design a real-time collaborative code editor

PremiumReal-timeMedium

  • Collaborative editing
  • Per file channels
  • Language server protocol

Quick answer

This real-time interview question asks you to design a real-time collaborative code editor. Aim for a design that delivers updates to many users with low delay, then explain connections, fan-out, ordering and trade-offs. Interviewers want to see how you keep latency low, handle reconnects and stay correct under load.

The problem

Design the real-time layer of a collaborative code editor like Replit multiplayer or VS Code Live Share. A host opens a project of hundreds of files and guests join to edit together, see each other's cursors, share code intelligence and watch one terminal; the hard part is sending each user only what they need.

Everyone can open different files, see who is in which file and where their cursor is, get completions and error underlines from the language server, and run the program. You may assume a tested merge engine already exists for concurrent edits to one text file; do not design the merge algorithm itself.

What must a real-time collaborative code editor do?

  • Per-file editing: Edits in an open file appear for others with that file open within 200 ms.
  • Cursors: Everyone sees who is in which file; inside a file they see others' cursors and selections. A follow mode tracks one person.
4 more requirementsUnlock to see all

How well must it do it?

  • Latency: Edits under 200 ms p95 between collaborators in the same region; completions under 300 ms.
  • Bandwidth: A user receives traffic only for the files they have open, plus tree and presence changes.
2 more requirementsUnlock to see all

What scale should you design for?

Use these numbers in your estimates.

The scale numbers unlock with this questionUnlock

Key concepts

  • Collaborative editing
  • Per file channels
  • Language server protocol
  • Cursor presence
  • Shared terminal
  • Output throttling

How you’ll practise

6 short steps · save and come back any time
  1. Requirements
  2. Estimate
  3. Connections
  4. Message flow
  5. Delivery guarantees
  6. Wrap-up

Lala, personalized to you, gives a hint when you ask and reviews your design when you are ready.

What do interviewers look for?

In any real-time design round.

  • Clarifies latency, ordering and delivery guarantees
  • Chooses a connection model with reasons
  • Explains fan-out to many receivers
  • Handles reconnects, missed messages and duplicates
  • Plans for hot spots and sudden traffic spikes
  • States trade-offs between consistency and speed

Questions people ask about this interview question

Which design type is this question?
It is a real-time question. You design a real-time collaborative code editor and explain your choices the way you would in an interview.
Is this question asked at entry level?
It is marked Medium. Entry-level engineers can practise it, but it expects you to reason about requirements and trade-offs, not only list components.
What should I cover first?
Start with who sends and receives updates, how fast they must arrive and what order matters. Agree on scope with the interviewer before you design anything.
Can I practise it for free?
It is a premium question. Sign up and unlock it once for 10 credits; it then stays unlocked. When you finish, Lala, your personalized AI mentor, can review your design for 30 credits.

Related questions

Updated · Written by the SevyDevy team

Premium questionSign up free, then unlock it