The cool thing about using ForeverVM with LLMs is that you can create diagrams almost as quickly as you can think of them.

Install ForeverVM in your @windsurf_ai editor: https://forevervm.com/docs/guides/forevervm-mcp-server/

The trick is a technique called fractional indexing, in which indices are fractions rather than integers. Can you solve the exercise and implement it?

Give it a shot at https://learn.yjs.dev/lessons/03-todo-list/!

Instead of keeping the todos in an array, try keeping them in a map.

We can give each todo an index property. The ordered list of todos is an array of the map values sorted by the index property. To move a todo, simply set a new index!

It sounds good in theory, but…

Here’s a curious fact about Yjs. Once you add a shared type to a document, it can never be moved. You can change what it contains and you can delete it, but you can’t move it from one place to another.

That means moving array elements really means deleting and re-adding them.

Just like before, though, things can get a little wonky when we start adding latency…

Can you solve the exercise and implement a counter that shows the correct count, even when clients update it concurrently?

Give it a shot at https://learn.yjs.dev/lessons/02-counter/!

Not so fast! This demo happens to be working because updates are synchronous. Every time the button gets clicked, the other client instantly receives the update.

When we add a little latency, the counter breaks!

Can you solve the exercise and implement a function that returns whether all the keys in a map are true?

Give it a shot at https://learn.yjs.dev/lessons/01-introduction/!

Like JavaScript’s Map object, a Yjs map holds key/value pairs.

Here you can see how Yjs syncs the values between two maps, with latency added to simulate a network connection.

A Yjs document is like a container for your state. To read and update that state, Yjs has a feature called shared types. They’re similar to JavaScript data structures such as Map — except shared types automatically sync between clients.

All in all, there are six shared types: