I Tried to Rebuild Liveblocks

The fellowship assignment was a collaborative whiteboard. One week.

The sane move was Liveblocks. Drop in their hooks, get cursors and presence and synced storage for free, ship by Wednesday. It's a great product, I'd have a great whiteboard.

But I'd never built the part underneath, and it bugged me that I didn't know if I could. Some of it was wanting to learn. Some of it, honestly, was wanting to show up to a one-week assignment with more than the assignment. So instead of installing the sync I started writing it.

Synced objects, maps, and lists that resolve conflicts on their own. Presence, cursors, undo/redo, all over plain WebSockets. A client that doesn't care what framework you're using, React hooks on top of that, and a server you just... run.

const { others } = usePresence()
const [cursor, setCursor] = useMyCursor()
const doc = useStorage((root) => root.doc)

Text was the one place I didn't go it alone. Collaborative text editing is a famously deep hole, so rich text rides on Yjs, with adapters for Tiptap and CodeMirror.

Then it got away from me, in the fun way. Once the primitives worked the whiteboard stopped being the project and became the first client of the project. A whiteboard is shapes in a synced map. A todo list is items in a synced list. A Notion page is blocks in a synced tree. So I kept going, mostly to see if the API held up when the app wasn't a whiteboard: a Notion-style editor, a markdown editor, a todo list, a workflow builder. Every new example sanded a whiteboard-shaped corner off the API.

A week later it's ten packages and six example apps, and it has a name: lively.

Somewhere in the middle of the week I figured out why I was actually doing it. Real-time collaboration has become a thing you rent (per seat, per connection, per month) and your cursors and documents route through a vendor because the plumbing is annoying. And the plumbing is annoying. But it's WebSockets and CRDTs talking to a room. That should be something you can own. Open source, on your hardware, your data staying home. That fits how I want to build things generally, this was just the first time a week of code lined up with it so cleanly.

It was fun. Thats worth saying plainly. This was the most fun I've had building in a while.

lively is alpha. The API will move and there are sharp edges. Next phase, once the dust settles: make it stupidly easy to self-host. One container you can drop on a VPS or one of those home-server platforms like Umbrel or CasaOS, whiteboard and all. Collaboration from a box in your closet feels right.

Funny enough, Liveblocks open-sourced their sync engine and dev server like five days before I started this. Basically the same idea. Great minds or whatever.