Hacker News Board Hacker News, browsed like a classic message board
Live data from Hacker News

Show HN: SyncedStore CRDT – build multiplayer collaborative apps for React / Vue

syncedstore.org

Post reply on HN
Print view View original

11–20 of 27 posts

Re: Show HN: SyncedStore CRDT – build multiplayer collaborative apps for React / Vue

#11

Post by yawnxyz »

YousefED wrote: post #6
mvf4z7 wrote: post #5

This is awesome to see. I have gotten interested in CRDTs in the last couple years due to them being used in the Elixir/Phoenix ecosystem. One question though, how do you integrate a backend into your library? I don't see anything mentioned in the docs.

Thanks! As it builds on Yjs (many kudos to Kevin Jahns for creating that awesome project + community), any backend that's compatible with Yjs works. The demos work based on WebRTC / BroadcastChannel (for the same browser / device), but I've listed different backends you can use here: https://syncedstore.org/docs/sync-providers

Hi! I just saw this reply — could you please put together a quick write up of an example deployment and the steps you took to do that (e.g. for the documentation site), including all the services you use?

Re: Show HN: SyncedStore CRDT – build multiplayer collaborative apps for React / Vue

#12

Post by hanspagel »

yawnxyz wrote: post #10

Wow this is so awesome! How/where does the data get saved for later? I'm guessing from the example, you don't need a database? E.g. I can just save the data to a document database, and next time someone works on it, just sync with the database? Or do I not need it at all because it's stored on the browser? And how would the information be associated with accounts, if someone wanted that feature? Also curious how/wher…

Creator of Hocuspocus [1] (which I’ll open source next year) here. You can use y-websocket [2] aswell. Hocuspocus is a (very nice) wrapper/API around y-websocket written in TypeScript.

https://hocuspocus.dev/

https://github.com/yjs/y-websocket

Re: Show HN: SyncedStore CRDT – build multiplayer collaborative apps for React / Vue

#13

Post by hanspagel »

mvf4z7 wrote: post #5

This is awesome to see. I have gotten interested in CRDTs in the last couple years due to them being used in the Elixir/Phoenix ecosystem. One question though, how do you integrate a backend into your library? I don't see anything mentioned in the docs.

I’m building one for Y.js. If you want to take it for a test drive:

$ npx @hocuspocus/cli

Re: Show HN: SyncedStore CRDT – build multiplayer collaborative apps for React / Vue

#14

Post by YousefED »

yawnxyz wrote: post #10

Wow this is so awesome! How/where does the data get saved for later? I'm guessing from the example, you don't need a database? E.g. I can just save the data to a document database, and next time someone works on it, just sync with the database? Or do I not need it at all because it's stored on the browser? And how would the information be associated with accounts, if someone wanted that feature? Also curious how/wher…

Thanks! Love the excitement :) SyncedStore supports the same backends as Yjs, here’s an overview: https://syncedstore.org/docs/sync-providers.

You can indeed store updates in a centralized database (wrapped with an API to handle auth / accounts) - this is probably the most common scenario.

But you can also go fully decentralized and use y-indexeddb to store updates in in the browser, and use a different transport to sync updates between users (e.g. webrtc).

—-

The cool thing is that the data model behind CRDTs is very flexible in this regard. All changes are captured in small “updates”, and as long as these updates at some point arrive at your device, your document can be updated with the changes (it’s eventually consistent).

The site runs on github pages without a backend (examples use y-webrtc).

Re: Show HN: SyncedStore CRDT – build multiplayer collaborative apps for React / Vue

#15

Post by dkersten »

saurik wrote: post #8
dkersten wrote: post #7

FYI, the examples don't work for me in Brave browser on linux: React example: "/App.tsx: Cannot read property 'getItem' of null (2:0)" Vue example: "file:///src/store.ts: Cannot read property 'getItem' of null (1:0)" Works fine in Chromium and Firefox though, so not sure what's up.

https://brave.com/privacy-updates/7-ephemeral-storage/

Ah. Thanks!

Re: Show HN: SyncedStore CRDT – build multiplayer collaborative apps for React / Vue

#18

Post by kevinjahns »

joris wrote: post #4

Awesome! I assume you’ve been using this in another project? How did you handle/implement undo-redo?

Yjs author here. Yjs ships a flexible selective undo-redo manager. You can define one (or several) undo managers that listen to changes that you want to be able to undo&redo.

https://docs.yjs.dev/api/undo-manager

Re: Show HN: SyncedStore CRDT – build multiplayer collaborative apps for React / Vue

#19

Post by kevinjahns »

BiteCode_dev wrote: post #16

How does the y-websocket handles network failure ? Does it autoreconnet? On reconnection, does it sync back changes that happened on or since failure ? Can you notify the user when it's happening ?

Yjs author here. On network failure, the client will automatically reconnect and synchronize with the backend. And yes, you can get an event that notifies you about the current connection status. When syncing with the server, you will only exchange the differences that were created while offline.

Re: Show HN: SyncedStore CRDT – build multiplayer collaborative apps for React / Vue

#20

Post by thingification »

Would you care to compare this with for example @localfirst/state, automerge and automerge-rs (latter two provide the CRDTs, i.e. similar to Yjs)?

https://github.com/local-first-web/state

https://github.com/automerge/automerge

https://github.com/automerge/automerge-rs

By the way despite that particular repo (@localfirst/state) last being touched 6 months ago, Herb Caudill definitely seems still active in this space (I believe he's been working on other parts of this more recently -- e.g. ideas about authentication), and I think automerge development itself (Martin Kleppmann) is quite active right now leading up to a 1.0 release which seems fairly imminent, for which a lot of fundamental work has been done, also coordinating with automerge-rs.

Post reply on HN