Make all webxdc apps web-ready (again) (effortlessly) (with WebRTC) (webxdc-x-web)

Looking at

I came up with way to make a webxdc app usable on the web (with peers - not just locally), with only a few extra lines of build configuration, or just a file copy-paste.
And that is, by making the webxdc API work on the web, by implementing it with WebRTC.

Implementation

The approach is similar to how we currently use webxdc.js files. That is, when the app is bundled for deployment as a website (and not a .xdc file), we include a webxdc.js file that implements webxdc API with WebRTC under the hood.

The y-webrtc library can be taken as a reference. I have some experience (hehe) with WebRTC myself, so I guess I’ll go be working on it.

Rooms, passwords

Since there is no “chat group” that you send the message to, we would have to make sure that peers can join the peers they want to join, and keep out the peers they want to keep out. Initially, without requiring any code changes to the app, we can achieve this by adding a room name and password to the URL, and letting people share that URL between each other. The same way, say, CryptPad does it, like this: https://cryptpad.fr/code/#/2/code/edit/-1PGMmcztxKb3h3hCWFtS/.

Later we could add API to control this (the password, the room name, the signaling servers).

Data sync

What I’m trying to figure out right now is the implementation details of how to get this “chat-like” webxdc update stream, to make sure that it’s consistent enough. It feels like there must be a library that does this, but I haven’t looked hard enough. I don’t think we need CRDTs for this as the messages thing has to be just (based on @Simon 's info) a grow-only set of immutable elements (messages), therefore there can’t be any conflicts in such a structure, it’s just about making sure that all peers eventually have all the members of the set. There is no need to ensure that, say, the order of the messages is the same for all the members.

About

Of course the guarantees of “no exfiltration even if the app is malicious” go away if you use a regular web version hosted on something like gh-pages. And even with CSP, WebRTC is required, and for now CSP in the field of WebRTC is only advanced enough to turn it on or off (here’s some more).
But if we decide to go for a proper web runtime that can also run .xdc files some day, this library should be of some help.

1 Like

Demo

I’m proud to announce a prototype!

To see it in work

  1. Go here (it’s a web version of the Editor app).
  2. When you open the page, the URL will get updated with the room id. Copy it.
  3. Send the copied link to a friend (or simply open it in a new browser tab, in case you have no friends).
  4. Type something - you’ll see the text appear on your friend’s device (or other tab).

To create a new room, simply open the URL without the part after # in a new tab.

Here’s also the Chess app (here’s the original webxdc app’s source code).

How to use

npm install --save-prod git+https://codeberg.org/WofWca/webxdc-x-web.git

Then you’ll probably need to make a separate build process for the web version. Just make sure that the webxdc-x-web/webxdc.js file is executed before any other code that relies on webxdc API, and that’s it. Adding import 'webxdc-x-web/webxdc.js' at the top of your index.js should work.

Limitations

The limitations of this prototype are severe enough to make most current webxdc apps near-unusable.

In short: when you or at least one of the peers closes the tab, it stops working properly.

  • One-time usage.
    It doesn’t handle reconnects well. When you close the tab, everything is lost.
  • Messages are not stored.
    It’s purely peer-to-peer, and there is no dedicated server to store messages. If you close the browser tab, and then someone else joins the room, they won’t receive your messages.

Source code

1 Like

Very nice Demo, maybe we could make a website where you can drag and drop or upload a webxdc to and create a room for it. Not sure if it would be possible on a static page with a good UX, but I think a generic site where you can invite your friends to use any webxdc would be super nice.

Yep, agree, this was discussed here: