Blog: AI agents as CRDT peers — collaborative AI editor post#4093
Draft
Blog: AI agents as CRDT peers — collaborative AI editor post#4093
Conversation
Draft outline for a post walking through how to build a collaborative AI editor using Durable Streams for both Yjs document sync and TanStack AI chat sessions. Published: false. Made-with: Cursor
- Fix CRDT streaming description (Yjs handles per-char fine) - Expand document tools section with full search/place/edit flow - Add software engineers angle to situation - Add OT → CRDT evolution context - Correct to three durable streams (doc, presence, chat) - Reframe markdown as deliberate IR choice - Simplify relative positions to focus on Yjs Made-with: Cursor
- Fix tool names to match actual code (insert_text, set_format, etc.) - Promote streaming edit routing to its own subsection - Trim tool list to focus on read → locate → edit flow - Add tech stack mention (TanStack Start, ProseMirror) - Correct repo URL to electric-sql/collaborative-ai-editor - Fix published: false - Resolve open questions (YouTube, async tease, repo URL) Made-with: Cursor
Title: "AI agents as CRDT peers: building a collaborative AI editor with Yjs". Image brief with shared prompt and three "twin cursors in a data stream" variations for ChatGPT DALL-E generation. Made-with: Cursor
Generated "twin cursors in a data stream" header image and added imageWidth/imageHeight to frontmatter. Made-with: Cursor
✅ Deploy Preview for electric-next ready!
To edit notification comments on pull requests, go to your Netlify project configuration. |
thruflo
reviewed
Apr 6, 2026
|
|
||
| I've spent years in the collaborative editing space, it's how I discovered sync engines. Since AI agents became part of my daily workflow, I've had an ear worm: what would it look like to integrate an AI agent into a Yjs rich text editing flow — not as a sidebar that dumps text, but as a real participant with its own cursor, presence, and streaming edits? | ||
|
|
||
| This post walks through how I built a [Collaborative AI Editor](https://collaborative-ai-editor.examples.electric-sql.com) demo — a TanStack Start app with a ProseMirror/Yjs editor and an AI chat sidebar — using [Durable Streams](https://durablestreams.com) as the single transport layer for both [Yjs](https://yjs.dev) document collaboration and [TanStack AI](https://tanstack.com/ai) chat sessions. Two integrations, one primitive, and the AI becomes a genuine CRDT peer. |
| This post walks through how I built a [Collaborative AI Editor](https://collaborative-ai-editor.examples.electric-sql.com) demo — a TanStack Start app with a ProseMirror/Yjs editor and an AI chat sidebar — using [Durable Streams](https://durablestreams.com) as the single transport layer for both [Yjs](https://yjs.dev) document collaboration and [TanStack AI](https://tanstack.com/ai) chat sessions. Two integrations, one primitive, and the AI becomes a genuine CRDT peer. | ||
|
|
||
| > [!Warning] Collaborative AI Editor demo | ||
| > Try the [live demo](https://collaborative-ai-editor.examples.electric-sql.com) and browse the [source code](https://github.com/electric-sql/collaborative-ai-editor). |
Contributor
There was a problem hiding this comment.
I know it adds noise but perhaps also links to docs for yjs and ts ai on the ds docs site?
|
|
||
| - Try the [live demo](https://collaborative-ai-editor.examples.electric-sql.com) and browse the [source code](https://github.com/electric-sql/collaborative-ai-editor) | ||
| - Read the [Durable Streams + Yjs docs](https://durablestreams.com/yjs) and [Durable Streams + TanStack AI docs](https://durablestreams.com/tanstack-ai) | ||
| - Check out [Durable Streams Cloud](https://durablestreams.com) for hosted infrastructure |
| excerpt: >- | ||
| ... | ||
| authors: [samwillis] | ||
| image: /img/blog/building-a-collaborative-ai-editor/header.jpg |
Contributor
There was a problem hiding this comment.
Just with this image, I wonder if using more of the playful "elephant in a sandbox" / "durable sessions" reference images and having a more playful character editing could be an alternative approach? This image is a bit in the StreamDB / Transports vein which I think could perhaps be more for base primitives, whereas this is more application level, pulling things together?
Fill in description and excerpt, fix published flag, apply non-breaking spaces consistently, tighten 'Why server-side matters' overlap, fix typos (earworm, YjsProvider doubling), and simplify the start_streaming_edit explanation. Made-with: Cursor
…eholders Add four code snippets verified against demo source: agent session setup, document tool definitions, relative anchor encode/decode, and durable chat connection. Add ASCII architecture diagram showing three Durable Streams. Add visible blockquote placeholders for remaining assets (video, screenshots, gifs). Made-with: Cursor
…, rename to Apr 8 Replace ASCII diagram with SVG, add visible placeholder blocks for video/screenshot assets, add cross-links to Yjs, TanStack AI, ProseMirror, TanStack Start, Durable Streams integration docs, and related blog posts. Rename post from April 6 to April 8. Made-with: Cursor
…teps, remove planning meta - Fix comma splice in conclusion, split long opening sentence - Add async to createServerAgentSession snippet - Rewrite conclusion to synthesize rather than restate - Fix link text to match actual post title - Vary repeated word choices, remove redundancy in markdown section - Restructure Next Steps with hierarchy (Try / Learn / Build) - Tighten Ink & Switch tangent, compress streaming markdown subsection - Add inline CTAs linking to Cloud and source code - Soften "survives everything" heading - Set published: false, remove planning meta section Made-with: Cursor
Made-with: Cursor
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment
Add this suggestion to a batch that can be applied as a single commit.This suggestion is invalid because no changes were made to the code.Suggestions cannot be applied while the pull request is closed.Suggestions cannot be applied while viewing a subset of changes.Only one suggestion per line can be applied in a batch.Add this suggestion to a batch that can be applied as a single commit.Applying suggestions on deleted lines is not supported.You must change the existing code in this line in order to create a valid suggestion.Outdated suggestions cannot be applied.This suggestion has been applied or marked resolved.Suggestions cannot be applied from pending reviews.Suggestions cannot be applied on multi-line comments.Suggestions cannot be applied while the pull request is queued to merge.Suggestion cannot be applied right now. Please check back later.
Preview: https://deploy-preview-4093--electric-next.netlify.app/blog/2026/04/08/building-a-collaborative-ai-editor
Summary
published: false— outline only, needs prose-upNext steps
/blog-reviewMade with Cursor