6 ms·

Show HN: Yboard is a multiplayer desktop-like workspace based on CRDT

165 points by selknam 4y ago

I've always been curious about real-time multiplayer user interfaces. When I found out about CRDTs and Yjs[1] I thought they could serve as a solid base for a project like that. So I built this pretty simple desktop-like UI (heavily inspired by lifeat.io) and used Yjs to replicate the whole UI state among multiple peers, creating the experience of a unique interface. Try online: https://yboard.lol https://yboard.lol [1]: https://github.com/yjs/yjs https://github.com/yjs/yjs

verdverm 4y ago
neat use of SVG as a drawing canvas, would be cool if it supported touch too
- selknam 4y ago
  Thanks! Touch support is definitely something I want to add for the canvas and the window positioning/resizing too.
learndeeply 4y ago
This looks really fun, modern incarnation of Google Wave. Made a test room here: https://yboard.lol/lobby?join=hackernews https://yboard.lol/lobby?join=hackernews
- seclorum_wien 4y ago
  error joining room.
diroussel 4y ago
Could WebRTC be used instead of websockets? Then you wouldn’t need a server (apart from a public STUN/TURN endpoint)
- aar9 4y ago
  Haven't tried with this specific project, but Yjs has a WebrtcProvider [0] which could be used where the project now uses WebsocketProvider [1]. Yjs is built to allow you to switch easily between providers so it shouldn't be too much trouble to make the change. [0] https://github.com/yjs/y-webrtc https://github.com/yjs/y-webrtc [1] https://github.com/felipeleivav/yboard/blob/main/src/services/YjsService.js https://github.com/felipeleivav/yboard/blob/main/src/service...
- deleted 4y ago
  [deleted]
- deleted 4y ago
  [deleted]
fullstackwife 4y ago
Great stuff!
- selknam 4y ago
  Thanks, glad you like it :)
jansan 4y ago
Hmm, something seems to have broken. Login does not work for me.
- macmac 4y ago
  Same here.
smcameron 4y ago
In case anyone else was wondering, like me, CRDT = conflict-free replicated data type: https://en.wikipedia.org/wiki/Conflict-free_replicated_data_type https://en.wikipedia.org/wiki/Conflict-free_replicated_data_...
LAC-Tech 4y ago
Why is the talk around CRDTs all about collaborative editing, and less about the more mundane but much more common scenario of multi-master CRUD apps?
- seclorum_wien 4y ago
  Because CRUD is the opposite of collaborative editing, and people are sick of it - CRDT represents a solution to getting humans working together through computers that isn't based on decades of cruft (disclaimer: imho)
- samwillis 4y ago
  Completely agree. Where CRDTs really shine is when you have a larger deviation of changes over time. They are brilliant for offline first type apps, and in fact are what Apple Notes use. Last year I experimented with combining Yjs with PouchDB/CouchDB to achieve automatic conflict handling with a multi master type architecture and eventual consistency. It worked brilliantly! I think it’s because there is just generally so much hype around “real-time” collaborative apps at the moment. But the reality is people spend much more time working async and merging changes later. I suppose what’s particularly brilliant with CRDTs is that they handle both use cases very well, you don’t have to have two different systems.
  - seclorum_wien 4y ago
    >I suppose what’s particularly brilliant with CRDTs is that they handle both use cases very well, you don’t have to have two different systems. .. and can equally be used to make CRUD if you wanna.
- rkangel 4y ago
  > Why is the talk around CRDTs all about collaborative editing, and less about the more mundane... I'm unclear how much of this is just a function of the 'talk' that we hear. For cultural reasons building frontend web-apps has bigger communication share than e.g. embedded software. Something similar might apply. Alternatively, CRUD apps are more the domain of enterprise SW which has not traditionally been where innovative software engineering has been done.
mhaberl 4y ago
"Couldn't connect to the room server. Error joining room" Show something cool on HN and get hugged to death :)
- selknam 4y ago
  Exactly this. Websocket server went down but already fixed that. Thanks for testing.
woodrowbarlow 4y ago
since this is based on CRDTs, does that mean one of the collaborators can go offline, continue working, and re-synchronize with the rest of the collaborators when they come back online? synchronizing after offline editing is the main reason to use CRDTs, but i don't see offline mentioned at all in the readme. (demo is currently hugged to death, so i can't test.)
- aaaaaaaaata 4y ago
  This comment makes me realize we really need standard phrasings for where a CRDT stores its data, and what behaviors are allowed/expected by each common scheme.
deleted 4y ago
[deleted]
bound008 4y ago
Looks really cool, just a friendly reminder to specify a license (or no license)
- selknam 4y ago
  Thanks, I've just added MIT licence :)
anigbrowl 4y ago
Very cool, though not sure why there's a Spotify button and whether you wanted to share your playlist with the whole world in the demo? Kinda feels like the modern version of Zawinksi's law: http://www.catb.org/jargon/html/Z/Zawinskis-Law.html http://www.catb.org/jargon/html/Z/Zawinskis-Law.html
anon115 4y ago
inspiring

165 points by selknam 4y ago

verdverm 4y ago

neat use of SVG as a drawing canvas, would be cool if it supported touch too

selknam 4y ago
Thanks! Touch support is definitely something I want to add for the canvas and the window positioning/resizing too.

learndeeply 4y ago

This looks really fun, modern incarnation of Google Wave. Made a test room here: https://yboard.lol/lobby?join=hackernews https://yboard.lol/lobby?join=hackernews

seclorum_wien 4y ago
error joining room.

diroussel 4y ago

Could WebRTC be used instead of websockets? Then you wouldn’t need a server (apart from a public STUN/TURN endpoint)

aar9 4y ago
Haven't tried with this specific project, but Yjs has a WebrtcProvider [0] which could be used where the project now uses WebsocketProvider [1]. Yjs is built to allow you to switch easily between providers so it shouldn't be too much trouble to make the change. [0] https://github.com/yjs/y-webrtc https://github.com/yjs/y-webrtc [1] https://github.com/felipeleivav/yboard/blob/main/src/services/YjsService.js https://github.com/felipeleivav/yboard/blob/main/src/service...
deleted 4y ago
[deleted]
deleted 4y ago
[deleted]

fullstackwife 4y ago

Great stuff!

selknam 4y ago
Thanks, glad you like it :)

jansan 4y ago

Hmm, something seems to have broken. Login does not work for me.

macmac 4y ago
Same here.

smcameron 4y ago

In case anyone else was wondering, like me, CRDT = conflict-free replicated data type: https://en.wikipedia.org/wiki/Conflict-free_replicated_data_type https://en.wikipedia.org/wiki/Conflict-free_replicated_data_...

LAC-Tech 4y ago

Why is the talk around CRDTs all about collaborative editing, and less about the more mundane but much more common scenario of multi-master CRUD apps?

seclorum_wien 4y ago
Because CRUD is the opposite of collaborative editing, and people are sick of it - CRDT represents a solution to getting humans working together through computers that isn't based on decades of cruft (disclaimer: imho)
samwillis 4y ago
Completely agree. Where CRDTs really shine is when you have a larger deviation of changes over time. They are brilliant for offline first type apps, and in fact are what Apple Notes use. Last year I experimented with combining Yjs with PouchDB/CouchDB to achieve automatic conflict handling with a multi master type architecture and eventual consistency. It worked brilliantly! I think it’s because there is just generally so much hype around “real-time” collaborative apps at the moment. But the reality is people spend much more time working async and merging changes later. I suppose what’s particularly brilliant with CRDTs is that they handle both use cases very well, you don’t have to have two different systems.
- seclorum_wien 4y ago
  >I suppose what’s particularly brilliant with CRDTs is that they handle both use cases very well, you don’t have to have two different systems. .. and can equally be used to make CRUD if you wanna.
rkangel 4y ago
> Why is the talk around CRDTs all about collaborative editing, and less about the more mundane... I'm unclear how much of this is just a function of the 'talk' that we hear. For cultural reasons building frontend web-apps has bigger communication share than e.g. embedded software. Something similar might apply. Alternatively, CRUD apps are more the domain of enterprise SW which has not traditionally been where innovative software engineering has been done.

mhaberl 4y ago

"Couldn't connect to the room server. Error joining room" Show something cool on HN and get hugged to death :)

selknam 4y ago
Exactly this. Websocket server went down but already fixed that. Thanks for testing.

woodrowbarlow 4y ago

since this is based on CRDTs, does that mean one of the collaborators can go offline, continue working, and re-synchronize with the rest of the collaborators when they come back online? synchronizing after offline editing is the main reason to use CRDTs, but i don't see offline mentioned at all in the readme. (demo is currently hugged to death, so i can't test.)

aaaaaaaaata 4y ago
This comment makes me realize we really need standard phrasings for where a CRDT stores its data, and what behaviors are allowed/expected by each common scheme.

deleted 4y ago

[deleted]

bound008 4y ago

Looks really cool, just a friendly reminder to specify a license (or no license)

selknam 4y ago
Thanks, I've just added MIT licence :)

anigbrowl 4y ago

Very cool, though not sure why there's a Spotify button and whether you wanted to share your playlist with the whole world in the demo? Kinda feels like the modern version of Zawinksi's law: http://www.catb.org/jargon/html/Z/Zawinskis-Law.html http://www.catb.org/jargon/html/Z/Zawinskis-Law.html

anon115 4y ago

inspiring