Chris Nicholas

I've built a new personal website! → chrisnicholas.dev/blog/a-new-blo…

And that's really all you need! If you'd like to download this Linear-inspired demo, I've just merged it ↓ lblcks.io/VReCa9O

On the front end, add `useOthers` to fetch your list of connected users—your agent will be amongst them. This snippet creates a simple avatar stack of connected humans/agents.

AI apps have a flaw—agents are a black box. It's frustrating when an agent edits your document, and there's no way to tell what changed. You can't trust it. And the problem only compounds with multiple agents. We can solve this with real-time presence ↓

Create multiplayer agents with realtime presence. Trigger live presence from within AI workflows, highlighting actions to connected users, and making agents real participants instead of background jobs.

@simeonGriggs Sort of, but you don't always need to append a character! Sometimes the halfway point has the same amount of characters, e.g. like how the middle value between `0.1` and `0.3` is `0.2`

@ctnicholasdev Ah got it, you keep appending characters. Neat!

One more trick—drop decimal entirely, and use base 96. Indices become single ASCII characters like !, %, ). They sort lexicographically with no custom comparator, and a base 96 character can slot between any two decimal digits. Same precision, but a fraction of the size.

@simeonGriggs Thank you! Hard to explain in one sentence, but inserting between `!` and `/` will give you the halfway point `!>`. It's similar to saying what's between `0.2` and `0.3`? It's `0.25`. A live demo is in this section :) #base-96-in-practice" target="_blank" rel="nofollow noopener">liveblocks.io/blog/how-crdts…

@ctnicholasdev Awesome thread! I've used LexoRank for this before, but using base 96 sounds way simpler. But what does it look like to insert an item between two here?

@blvdmitry Hey, thank you!

This is the content I’m here for ✨

If you'd like to play with a full interactive deep-dive, @nvie and I wrote it up! lblcks.io/W1Ehpn6

At @liveblocks, we provide APIs for building collaborative apps—all of this is already built into our `LiveList` primitive, which you can use directly in JavaScript and React. No worrying about servers, connections, realtime, it all works automatically!

Real apps push to the end of lists constantly, which causes new indices to balloon into long strings. At Liveblocks we use viewport-based growth—when the last item needs another digit, we jump by 3 chars and then increment by one. Indices stay tiny. 0.8 → 0.9 → 0.9001

Creating a multiplayer list is trickier than it looks. When two users make simultaneous edits, state drifts out of sync—you can't just use a regular array. Real-time tools like Figma and Liveblocks use a specific technique to solve this. It's called fractional indexing ↓

Decimals only work in theory. Floating point decimals runs out of precision after ~50 inserts at the end of the list, as you can see below. Storing indices as strings fixes that, but we've still got another problem—indices keep growing.

What if Alice and Bob both pick the exact same fractional index, say `0.75`? It stops working. The fix: give every user a unique ID and append it to the index. Alice's `0.75` becomes `0.75-001`, Bob's becomes `0.75-002`. No two indices can ever collide.

Because each position is independent, concurrent edits just work. Alice and Bob can insert, delete, and reorder at the same time—each op only updates one index, and both clients converge on the same list. No cascading updates, no conflicts. There is an edge case though…

Fractional indexing flips the model. Each item carries its own position value—a decimal between `0` and `1` that sits between its neighbours. Insert an item between `0.1` and `0.5`? Pick the halfway point, `0.3`. Between `0.1` and `0.3`? It's `0.2`. There's always room.

It gets worse when two users edit at once. Alice inserts an item, Bob deletes one. Both clients are working from their own local array, so when their changes merge, they end up applying ops on top of different states. The list diverges.

In a normal array, each item's index comes from its position. Insert one item near the start, and every item after it gets a new index. Locally that's fine. But in multiplayer, every shifted index is a message that has to travel over the network.