Let people finish
the thought together.

Add cursors, presence, and conflict-free document editing without making a collaboration server your next product.

Start buildingSee it live
collaboration.ts
import { createDendriStore }
  from "@afterrealism/dendri-client";
import { DendriYjsProvider }
  from "@afterrealism/dendri-y";
import * as Y from "yjs";
import { Awareness }
  from "y-protocols/awareness";

const room = createDendriStore({ url });
const doc = new Y.Doc();
const awareness = new Awareness(doc);
const provider = new DendriYjsProvider({
  room, doc, awareness
});

room.join("document-42");

Shared momentum.
Not save and pray.

A shared cursor gets attention. Keeping every person's work intact earns trust.

Two people edit at once.

Last-write-wins can quietly erase the sentence someone just poured their attention into.

Every edit has a place.

Yjs models the document as a CRDT, so concurrent changes converge without a central document server deciding whose work survives.

Someone joins late.

They need the current document, not an empty editor and a promise that updates will arrive eventually.

The document catches them up.

The Dendri Yjs provider exchanges state vectors, transfers missing updates, then streams incremental changes as people keep writing.

Someone leaves.

A stale cursor makes the room feel haunted and the software feel unreliable.

Their presence leaves too.

Awareness carries cursors, selections, and names as ephemeral state. The provider removes remote awareness when a peer leaves.

Your editor. Your room. One provider.

Dendri handles the transport. Yjs handles conflict-free state. Your existing editor bindings keep doing their job.

Read the collaboration guide →

  1. Install the shared stack

    Keep Yjs and the client as peer dependencies so the app shares one instance.

    npm install @afterrealism/dendri-client @afterrealism/dendri-y yjs y-protocols

  2. Create the document

    Use standard Yjs shared types and awareness in your app.

    const doc = new Y.Doc();
const awareness = new Awareness(doc);

  3. Bridge it into the room

    Create the provider, join, and let synchronization begin as peers arrive.

    const provider = new DendriYjsProvider({ room, doc, awareness });
room.join("document-42");

Watch two editors shape one map.

Open the demo in two tabs. Draw or edit a shape in one and watch it appear in the other.

Try live cursors · Try the whiteboard

Dendri moves the document.
It does not store it.

When the last peer leaves, Dendri does not keep a copy. Add local persistence such as y-indexeddb or your own durable store when the work must survive the room.

Read the collaboration guide

Give them a document worth sharing.

Start with one room, then connect the editor your users already know.

Start buildingRead the collaboration guide