How Figma’s multiplayer technology works | Figma Blog (opens in new tab)

Figma built a custom multiplayer system because traditional operational transformation (OT) was too complex for its document-editing needs. Its client/server architecture synchronizes document changes over WebSockets, supports offline editing, and separates document collaboration from other data such as comments and users. The system began as a prototype that enabled rapid experimentation before being integrated into production.

Why Figma Built Its Own Multiplayer System

• In 2015, no major design tool offered real-time collaborative editing.
• Figma avoided OT, the algorithm used by tools such as Google Docs, because it considered OT unnecessarily complex for its problem space.
• The custom approach was designed to be simpler and faster to implement.
• Multiplayer eliminated the need to export, email, or manually synchronize design files.
• It also allowed non-designers—such as copywriters and developers—to participate or view work without interrupting the designer.

Figma’s Client/Server Architecture

• Figma clients are web pages connected to a server cluster through WebSockets.
• Each multiplayer document runs in a separate server process, with all editors connected to that process.
• When a document opens, the client downloads an initial copy of the file.
• Subsequent changes are synchronized in both directions over the WebSocket connection.
• Server performance and scaling were important considerations, later addressed in part through the use of Rust.

Offline Editing and Reconnection

• Clients can continue editing while offline for an arbitrary period.
• When reconnecting, the client:
  • Downloads a fresh version of the document.
  • Reapplies its locally stored offline edits to that latest state.
  • Resumes synchronization through a new WebSocket connection.
• This keeps connection and reconnection logic relatively simple by concentrating multiplayer complexity on already-connected clients.

Separate Systems for Different Data

• Figma’s multiplayer system is used only for syncing document changes.
• Comments, users, teams, projects, and similar information are stored in Postgres.
• That data is synchronized through a separate system because it has different requirements involving:
  • Performance
  • Offline availability
  • Security

Prototyping Before Production

• Figma first created a standalone browser-based prototype rather than experimenting directly in the production codebase.
• The prototype simulated three clients connected to a server and visualized the complete system state.
• Engineers could test:
  • Offline clients
  • Bandwidth-limited connections
  • Different collaborative algorithms
  • Alternative data structures
• Once the design was validated, the ideas were transferred into the main codebase.

Figma’s experience demonstrates that collaborative systems do not always require the most established algorithm. A focused, custom protocol—validated through fast prototyping—can provide a simpler solution when its data model and product requirements differ from tools like document editors.