Add Real-Time Spreadsheet Collaboration to Your JavaScript Applications

Multi-User Editing

The SpreadJS Collaboration Server brings true multi-user, real-time editing to your JavaScript spreadsheets. Built on a powerful Collaboration Framework and Operational Transformation (OT) engine, it keeps data synchronized and conflict-free as users make concurrent updates, from cell edits to row insertions. Each collaborator’s cursor, selection, and color-coded presence are displayed live, improving team awareness and workflow transparency. Developers can configure Edit or View-only modes for secure, role-based access and even sync multiple spreadsheet instances locally for single-user multi-view setups. Whether enabling shared financial modeling, team reporting, or collaborative data input, this add-on delivers a seamless Excel-like co-authoring experience directly in your web app.

• SpreadJS-Sheets-Collaboration Documentation

Operational Transformation (OT) Engine

At the heart of this JavaScript spreadsheet Collaboration Server is the Operational Transformation (OT) Engine, a powerful real-time synchronization framework that guarantees data consistency when multiple users edit the same spreadsheet. OT dynamically adjusts incoming operations—like cell edits, row insertions, or deletions—to prevent conflicts and maintain a single, unified workbook state across all clients. This allows users to edit simultaneously without overwriting one another’s changes.

The engine supports custom OT types, fragment-based  synchronization for large datasets, and middleware hooks for permission validation, data logging, or snapshot control. It offers complete flexibility for developers managing shared data. With its modular and efficient architecture, the OT Engine forms the backbone of seamless, real-time spreadsheet collaboration in modern web applications.

• JS-Collaboration-OT Documentation

Bidirectional Communication

The SpreadJS Collaboration add-on is powered by JavaScript-based Collaboration Framework that enables continuous bidirectional communication between clients and the server. Using WebSocket connections, it synchronizes data and broadcasts updates in real time so that every user sees changes as they happen. This framework supports multi-user room management, message broadcasting, and automatic reconnection to ensure stable collaboration—even during network interruptions.

Developers can extend the system with middleware and hooks to inject custom validation, authentication, or logging at any point in the data flow. The collaboration architecture is modular and scalable, combining the core js-collaboration engine with optional add-ons like js-collaboration-ot for Operational Transformation and js-collaboration-presence for user status tracking. Together, they provide the reliable, low-latency communication foundation required for interactive spreadsheets, shared dashboards, and any real-time co-authoring environment.

• Collaboration Framework Documentation

Remote Collaboration Mode

In Remote Collaboration Mode, the SpreadJS Collaboration add-on extends beyond local synchronization to support true cloud-based teamwork. When users edit the same workbook, the add-on listens for data-model changes, generates operation sets, and transmits them to the server through the Collaboration Framework. The server processes these operations using Operational Transformation (OT) logic to maintain accuracy, then broadcasts the results to all connected clients—ensuring that every participant sees updates instantly.

This setup enables distributed teams to work together on shared spreadsheets with consistent state management, live presence indicators, and secure permission control for edit or view-only roles. Developers can rely on the Collaboration Service to handle conflict resolution, change broadcasting, and user awareness automatically—delivering a scalable, real-time spreadsheet experience for modern web applications.

• Working Mechanism Documentation

User Management

This JavaScript spreadsheet collaboration add-on allows robust User Management system through the IUser interface, enabling developers to define user identities and control their access levels within shared workbooks. Each user is assigned a unique ID, display name, and optional color for easy visual distinction during collaborative sessions. The associated IPermission structure allows fine-grained control over user capabilities, including edit and view modes, as well as optional permissions for filtering, sorting, resizing, or hiding rows and columns.

Through APIs such as setUser, getUser, setPresences, and getPresences, developers can dynamically assign users, retrieve active sessions, and manage real-time presence indicators—ensuring that every participant’s actions and selections are clearly represented. This system provides a foundation for secure, organized collaboration across large teams, giving developers the flexibility to define role-based permissions and visual cues for each participant in a shared workbook.

• User Documentation

Permission Control

The SpreadJS Collaboration add-on provides a detailed permission model through the IPermission interface, allowing developers to manage how users interact with shared workbook content. Each user operates in one of two document modes, Edit Mode or View Mode, defined by the BrowsingMode enumeration. In Edit Mode, all actions are synchronized in real time, giving users full editing capabilities. In View Mode, users can only view content, but specific non-destructive actions can be selectively enabled to enhance data exploration.

These optional permissions include the ability to hide or resize rows and columns, apply filters or sorts, and perform non-data-modifying operations. Developers can assign these rights programmatically through the setUser() API or combine them with real-time presence tracking using bindPresence().

This fine-grained permission system balances collaboration and control, ensuring that teams can safely view, analyze, or interact with shared data while protecting against unintended changes. It’s ideal for enterprise environments that require role-based access and controlled editing in shared spreadsheet workflows.

• User Permissions Documentation

API-Driven Access Management

This real-time JS spreadsheet collaboration add-on provides developers with a complete API suite for managing user access, roles, and presence in shared workbooks. Using the four key methods setUser, getUser, setPresences, and getPresences developers can define each user’s identity, assign permissions, and track collaborative activity in real time.

These APIs make it easy to enforce role-based access—whether users can edit, view, or perform limited actions—and to track live interactions like selections or cursors. Together, they deliver flexible, programmatic control for secure and dynamic multi-user collaboration.

• User Capabilites Documentation

Live Cursor Tracking

The SpreadJS Collaboration add-on integrates js-collaboration-presence to deliver real-time visibility of collaborator activity through live cursor tracking. Each user’s cursor, selection range, and editing area are instantly shared and updated across all connected sessions, allowing teams to see where others are working at any given moment.

This presence layer uses a lightweight client-server model to broadcast and synchronize user states, updating the interface dynamically as users join, leave, or move within the document. Developers can subscribe to presence events and use APIs such as submitLocalState and submitLocalStateField to track or update local cursor data.

With this feature, collaboration becomes more coordinated and transparent, preventing conflicts, highlighting shared focus areas, and providing a clear, real-time view of everyone’s contributions.

• Js-Collaboration-Presence Documenation

Selection Highlights

This JavaScript spreadsheet collaboration server provides real-time Selection Highlights, powered by the built-in Presence feature. As multiple users work within the same spreadsheet, each collaborator’s selections are visually outlined and labeled with their username. Unique color assignments make it easy to distinguish between contributors at a glance.

Developers can configure or customize the color scheme, track selections using setPresences and getPresences, or automatically bind users and presence data via bindPresence. These highlights update instantly as users move or edit, allowing teams to coordinate changes, prevent overlap, and maintain full visibility during real-time collaboration sessions.

• Presence Documentation

User Initials & Color Indicators

The SpreadJS Collaboration Server enhances real-time teamwork with intuitive User Initials and Color Indicators. Each collaborator is represented by their initials and a unique color tag, displayed directly beside their current selection or editing area.

These visual markers help distinguish contributors and reduce confusion in multi-user sessions, ensuring clear visibility into who’s working where. Developers can customize user colors or allow the system to assign them automatically, improving readability and coordination during concurrent editing. Combined with presence tracking, this feature delivers a seamless, transparent collaboration experience.

• SpreadJS Sheets Collaboration Documenation

Presence APIs

The Presence layer provides a tiny, focused API for live user state. On the client, instantiate Presence and call subscribe() to receive collaborators, read other user states for the latest map of users, and publish your own activity with submitLocalState(...) or submitLocalStateField(name, value). Remove your state with removeLocalState(), and react to lifecycle events using on('add'|'update'|'remove', ...). On the server, enable presenceFeature() to coordinate and broadcast presence within rooms alongside the base js-collaboration transport (WebSocket). For SpreadJS, a helper bindPresence(workbook, presence, user) wires user identity and selection rendering so ranges light up with initials and colors instantly. Presence is in-memory by design (no built-in persistence); if you need durability across restarts, add a small persistence layer or periodic snapshots on the server.

• Js-Collaboration-Presence Documentation

Modular Architecture

The Collaboration Framework’s modular design powers real-time, multi-user interaction through a layered architecture built on three key modules: js-collaboration, js-collaboration-ot, and js-collaboration-presence. At its core,  js-collaboration  handles bidirectional data flow, room management, and message broadcasting via WebSocket connections. The OT (Operational Transformation) add-on ensures data consistency when multiple users edit the same model simultaneously, supporting features like custom OT types, persistence through adapters (PostgreSQL or SQLite), and conflict resolution. The Presence add-on tracks user activity, showing cursor positions, selections, and active collaborators in real time.

This modular approach allows developers to extend the same real-time backbone to any application, whether spreadsheets, text editors, whiteboards, or custom business tools, using separate client and server packages for flexible, decoupled deployment.

• Collaboration Documentation

Automatic Reconnection

The Collaboration Framework ensures persistent connectivity through its heartbeat and auto-reconnect system, which continuously monitors the health of client-server connections. If a network interruption or disconnection occurs, the framework automatically attempts to re-establish communication, resyncing data and restoring session state without manual refresh. This mechanism works alongside the bidirectional communication and room-based architecture, guaranteeing that all active participants remain in sync even when transient network issues occur—ideal for real-time applications like chat, spreadsheets, or document co-editing.

• Js-Collaboration Documentation

Database Integration

The Collaboration Framework separates sync logic from storage through the IDatabaseAdapter. On the server, every edit is recorded as an operation while the framework also maintains a single up-to-date snapshot for fast loads. The adapter API covers reading ranges of ops, fetching document metadata and snapshots, committing new ops/snapshots (with idempotent checks), and optional “fragment” reads to speed large documents. You integrate it by passing your adapter instance into DocumentServices at startup. Out of the box, you can use MemoryDb for local development (in-RAM, non-persistent), or choose a persistent adapter for production: Postgres or SQLite. If your stack requires a different backend, implement the same interface to connect any store—letting you persist history, restore state after restarts, and audit changes without changing your collaboration code.

• Database Adapter Documentation

Extensible Middleware & Hooks

The Collaboration Framework supports a flexible extension model through its middleware and hooks architecture, allowing developers to control how data flows through the server-side Operational Transformation (OT) engine. Middleware enables interception, validation, or modification of operations before they’re stored or broadcast, ideal for enforcing permissions, authentication, or compliance checks. Hooks, on the other hand, provide lightweight event listeners for observing system activity (e.g., tracking edits, monitoring performance) without interrupting the flow.
You can register middleware with DocumentServices.use() to handle actions like receive, submit, commit, or afterWrite, giving full visibility and control over the collaboration lifecycle. Together, middleware and hooks make it easy to extend and secure your collaboration server with minimal overhead.

• OT-Middleware Documentation

Fragmented Sync Mechanism

The Fragmented Sync Mechanism improves server efficiency for large, high-traffic documents by breaking snapshots into smaller, independent fragments, such as one per worksheet in a workbook. When an operation (like setCellValue or addWorksheet) is applied, the framework updates only the relevant fragment instead of reloading and rewriting the full snapshot.

This granular approach dramatically reduces I/O overhead and accelerates synchronization in real-time editing sessions. The OT type defines createFragments, applyFragments, and composeFragments methods to handle fragment creation, targeted updates, and reassembly into a complete snapshot when requested by clients.

Ideal for enterprise-scale scenarios, fragmented sync ensures scalability under heavy collaboration workloads, maintaining data consistency and responsiveness without overloading your storage system.

• Fragment Documentation

Custom OT Types

Custom OT Types allow developer's to tailor real-time collaboration to their domain, from spreadsheets and rich text to bespoke data structures. Users can implement a type with a unique uri and provide the logic to transform concurrent operations (so intent is preserved under conflict) and apply those operations to the current snapshot. Register the same type on both the client and server, and the framework handles delivery, ordering, and consistency across rooms. Start simple, e.g., text insertions with position shifts, and evolve as needed with additional op kinds or extended server capabilities like fragmented snapshots for large documents. The result is a deterministic, scalable sync layer that reflects your business rules, not a one-size-fits-all editor.

• Core Features Documentation

Collaborative Undo & Redo Support

Collaborative Undo & Redo records changes as operations (ops) instead of raw UI state, so reversing an action cleanly syncs across all clients. Each user’s undo stack contains only their own ops; when others edit in between, your undo/redo is automatically transformed (via the OT engine) to target the correct, current cells/ranges—preserving intent without breaking consistency. This feature remains command-compatible: you trigger undo/redo the same way, but the system replays ops rather than re-running your command logic. To hook UI or analytics around these flows, use the dedicated lifecycle events, CollaborationStartUndo, CollaborationEndUndo, CollaborationStartRedo, and CollaborationEndRedo, which expose the applied ChangeSet so you can update status, logs, or custom indicators without extra plumbing.

• Undo Documentation

Error Handling & Rollback

Error Handling & Rollback is built on the OT engine, which treats every change as an operation and resolves collisions by transforming those ops against anything that arrived concurrently. Instead of locking documents or discarding work, the system adjusts positions and ranges on the fly, reapplies the corrected ops, and drives all clients to the same final state. If a network hiccup or server retry introduces duplicates or late arrivals, idempotent operation handling prevents double-apply; if another user’s change shifts your target, your edit is remapped to the correct, current location. The result is an eventual-consistency flow that favors preserving each author’s intent while guaranteeing a single agreed-upon snapshot for everyone. In edge cases where intent cannot be perfectly preserved, the engine still converges safely and emits the updated state so UIs can reflect the outcome and allow users to undo or adjust as needed.

• Conflicts and Transforms Documentation