Skip to content

Yjs

Yjs is a JavaScript library that combines edits to shared text or data so separate copies can agree once they receive the same changes.

Visit Yjs

What does Yjs do when two people type at once?

Yjs records edits as updates that can be combined regardless of the order they arrive. If two people add different sentences and both copies receive both edits, their copies can agree. Choose a Yjs-compatible editor to display and edit the draft.

Combining text edits cannot decide your app’s business rules. For example, whether two people can reserve the same appointment still belongs in the system that accepts the booking.

What do you need beyond the library?

Pick a connection provider, the piece that carries changes between browsers, and durable storage for saved drafts. With a WebSocket provider, a server can route updates for each document. Choose a backend that checks both the signed-in identity and what it can read or write in that document.

The basic y-websocket development server keeps documents in memory by default. A restart can erase them. Use it for disposable work or choose a backend with durable storage and access checks for customer drafts. A document name is a way to look it up. Your backend still has to decide who can open it.

Will the draft survive reopening the page offline?

A network provider can exchange missing edits when the connection returns. For browser-local persistence, add y-indexeddb to save changes in that browser. Reopening the whole app offline also requires a way to load the app’s files without the network. A local copy only proves this browser retained the data. Check server storage with a fresh authorized profile.

Decide how to handle local copies on shared devices. Revoking server access does not erase a copy already stored in someone’s browser.

How do you verify merging and document access separately?

Use a local or disposable app with fictional documents. Confirm its backend, sign-in, persistence and callbacks all point at the test setup. If you cannot verify the routes, inspect the provider and permission code or sketch the two edits without connecting.

  1. Check an authorized edit
    In separate browser profiles, open the same sample draft as two permitted editors. Make a small online change and verify the other profile receives it. Separate profiles avoid a same-browser shortcut that can pass edits without the server.
  2. Disconnect and make two edits
    Disconnect only the second profile and confirm its provider shows disconnected. Leave both tabs open. Add a different sentence to each copy and confirm the offline sentence has not reached the online profile. Reconnect the second profile. Both copies should show both sentences.
  3. Check access and persistence
    Try the same document as a fake nonmember in a clean profile and verify that the backend denies the connection and sends no document content. If the local demo has no access checks, mark this check untested until you use your chosen backend.
  4. Restart without letting the editors restore the draft
    Once both editors show both edits and the disposable backend has finished saving them, close both editor profiles and keep them disconnected. Restart the backend. Open the draft only in a clean permitted profile that has never opened it. Both edits should still be there. If you cannot verify that the backend saved the edits or keep the earlier profiles disconnected, mark durability untested.

What do you pay for, and how do you move a draft?

The Yjs library uses the MIT license. Budget separately for the connection server or hosted provider, storage and maintenance. Save an encoded document update and try applying it to a fresh Yjs document before relying on it as a backup. Save app permissions and other records separately. If you need readable text or an editor file, export through the editor as well.