Make any site multiplayer in a few lines. Serverless WebRTC matchmaking

[kabes]

This isn't serverless. It's just using someone else's servers for the SDP signaling. And in a production app you'd likely also need turn servers and maybe SFU servers.

There are some true serverless approaches out there for the signaling, e.g. where both peers scan each other's QR code, but that obviously has very limited use.

[haxiomic]

You're not wrong! Serverless is a funny term. Cloud companies use serverless to mean you don't have to provision and manage the server yourself, but it is still very much serverful technically speaking. This is neat in that you don't even need to setup anything with a cloud provider yourself to enable p2p connections

[kaoD]

I've always been obsessed with true P2P WebRTC with QR codes but, at least back in the day, Firefox fails the offer under a very short timeout (~5 secs IIRC) which made out of band signaling completely impossible.

[littlecranky67]

serverless nowadays means "no server in YOUR infrastructure"

[6r17]

I didn't know about the QR-Code solution how does it work ?

[moffkalast]

They say that serverless stacks have the highest server bills.

[kamranjon]

Awesome way to demonstrate exactly what your library does - also the library itself is a great concept - was just looking for something just like this the other day.

[evbogue]

I use Trystero as one of the transfer methods on wiredove. it's super cool. it doesn't always work because punching thru NAT is a pain, but when it does work it's awesome. Trystero is also cool if you want to hook up a webcam or a video meeting with the minimal amount of code.

[araes]

Small nitpick. Tried logging in simultaneously with a desktop and a phone to make it wasn't BSing, and it was actually sending moves/fruit correctly. Yes, appears to. However, found out phones don't update on touchmove. Only on final touch.

Be nice if it used:

  const [sendMove, getMove] = room.makeAction('pointerMove')

  window.addEventListener('pointermove', e => sendMove([e.clientX, e.clientY]))

It's part of the Pointer Events API and provides a unified event model for handling mouse, pen/stylus, and touchscreens.

If necessary it can then use "PointerEvent.pointerType" to find the actual type.

https://developer.mozilla.org/en-US/docs/Web/API/Element/poi...

Otherwise, neat capability, and there's at least several different concepts it seems like it would be enabling of. Mapping / GIS, you could see where other people are browsing on somewhere like Google Maps. Maybe leave little markers that fade with time. Temporary file sharing where you broadcast a list of available files after logging on and peers can send requests. Dropbox-esque send yourself stuff with a home system that's always logged on. Computer-aided design (CAD/CAE/CAM) or stuff like blender/photoshop, work on models/images together. Obvious stuff like word/excel. Field Service Management, collaborative service calls.

Admittedly, also enabling of botnets, darkweb, and other such ideas. However, such is the nature of a lot of these types of technologies.

[araes]

Made a site to try out the framework. Mostly just testing that it works and actually produces something.

Swapped over to having birds instead. Little bit confusing how to actually implement some of the functionality and how some of the functions work. Otherwise, relatively easy to set up and have working.

https://araesmojo-eng.github.io/trystero_test/

[Reubend]

WOW this is cool! I love this, but as a nitpick, how scalable is it to do each connection peer to peer? Doesn't that mean that I have to keep a stream connection open for everyone who I want to include in the room?

[michaelt]

> how scalable is it to do each connection peer to peer?

I can tell you roughly how it works for webrtc video calls.

If you're in a 5-person peer-to-peer webrtc video call where you receive 4 streams of video, you also need to send 4 streams of video. This is scalable in a sense; the uplink and downlink requirements are equal.

The problem comes if you're in a 100-person meeting, and the application logic has hidden 95 people's video to save on bandwidth. In that case, while you'd only receive 4 streams of video you'd have to send 99.

In practice, webrtc video calling often uses an 'SFU' or 'Selective Forwarding Unit' where you send one video stream to the vendor's cloud server and they forward it to the other people in the meeting. This also benefits people on asymmetric connections, and mobile users where uploading costs battery life, and users behind highly restrictive firewalls where webrtc's NAT traversal fails to work.

[bhaney]

> how scalable is it

Considering the site just spams my error console with

  DOMException: Failed to construct 'RTCPeerConnection': Cannot create so many PeerConnections

I'd say not very.

[ermir]

When I experimented with this a few years back a true NxN room would cap around 8 people when using PCs and 4 on mobile, the bottleneck is encoding/decoding of the video. For larger rooms you need a server to route the video to all recipients, this is called an SFU. With an SFU you can have hundreds of participants, but not everyone can speak or be seen at once.

For audio-only the sky is the limit. I used to work on a voice-based social media and you also need an SFU here as well, but I added a few mixing features so that multiple incoming audio streams would be mixed together into a single outgoing one. Was very fun (and scalable).

[kabes]

It's not very scalable. Regular rules of webrtc apply, so once you go to a certain number of users, you would have to use an SFU approach.

[kookamamie]

> Serverless

uses someone else's network for signaling

[zknowledge]

to the person who's cursor I chased around for more than a couple of minutes, I don't know why I did that and I apologize.

[Paedor]

Hey cool! I once hacked together a serverless game like this using firebase as an intermediary. https://github.com/amdson/rtcpvp / https://amdson.github.io/rtcpvp. I remember wishing this existed, setting up ICE p2p was truly not enjoyable.

[dmotz]

https://github.com/dmotz/trystero

Direct link to the underlying source code.

[jjangkke]

Few things

1) Serverless isn't really serverless and we are sick of this AWS speak. The trend lasted briefly but it isn't appealing when you are metered for every little thing and unable to SSH into a host and resolve issues

2) You can already do matchmaking easily with FOSS self-hosted solutions. These don't cost a lot of computing or bandwidth but some developers think its a chaotic and resource heavy problem.

[sotspecatcle]

Cool, not working in Safari for me though.

[quietfox]

It worked for me in Safari for a while, but then the entire browser stopped working.

[pacha3000]

it's laggy as hell on firefox. but works nice on chrome. won't use it

[kzrdude]

I wonder if we can make a live heatmap of text selections on the page, smoothed and decaying with time.

[philipallstar]

I remember cloning the twilio code for video conferencing for webrtc and it working instantly. Very cool.

[dudefeliciano]

On the other hand setting up the turn servers and so on for signaling before the webrtc connection is established can be a nightmare, if not using a third party service like twilio

[maxlin]

This is mad, I love it. Way more "serverless" than what the term is commonly used for!

[Razengan]

It'd be cool if you could easily publish multiplayers games to itch.io or similar websites from Godot or Unity and have automatic matchmaking: the first player to visit the game pages gets matched automatically with the next, and so on.

Is there anything like that?

[numpad0]

You can't find the first one without the first one having static IP found from something in the page, which this thing solves using external services of developer choice, including commercial Supabase and Firebase systems. But the docs says it supports Bittorrent for that, so it's probably good.

[tasuki]

I've been looking for this too!

I'd love to use an existing protocol to get (distributed?) user accounts and chat and stuff, and just build my game as a plugin for that. Or something.

[jckahn]

I used Trystero in exactly this way for https://www.farmhand.life/!

[allknowingfrog]

I've been exploring PeerJS (https://peerjs.com/) recently. This seems like a similar concept. Would it give me anything that PeerJS doesn't?

[dmotz]

I'm the Trystero author and I'd say both libs attempt to accomplish the same goal but with very different APIs. One key difference is PeerJS uses a single centralized server by default for matchmaking, whereas Trystero offers lots of flexibility and redundancy, using various signaling connections in parallel.

[peterleiser]

The site says "Right now youʼre the only person with the page open, but you can cheat and just open this URL in another tab to see what itʼs like with others." I'm using Firefox and Chrome on Ubuntu. When I try a second tab or one in Firefox and one in Chrome my computer's network connection locks up (pings stop). I have to close the tabs and then pings to google.com come back at 30 seconds and slowly come back to normal. It appears that http://playground.nostrcheck.me/relay is the problem.

[jsomedon]

This is so fun. You know what, you should change the picture of cursor from hand to something like, bee, or even fly, that should make it even more hilarious :-p

[efilife]

This is so fun! It feels kinda sad to disconnect from the site and lose my two cursor friends

[wewewedxfgdf]

I wanted to throw objects at others and to make things explode. That's just what it brought up in me.

[dsign]

Just a reminder that this kind of user-to-user interaction feature makes your website a "social network" according to UK regulation (and Mississippi's, and more jurisdictions coming soon), and therefore you must get copies of government ID of your users so that you can deny them access if they are underage, and rattle them to the police if you suspect they are committing thought crime by sending certain fruits. Obey the law.

[andai]

I made a little multiplayer arcade game last year. I added a chat feature with TTS. About an hour after launch it was just the n word over and over again. (Also zalgo text, which somehow strained the browser more than a video game!)

I removed the chat feature.

At any rate, getting banned by OFCOM is starting to sound like a badge of honor these days.

[dudefeliciano]

how are these laws enforced outside of the UK and Mississippi?

[pharrington]

Agree, with caveat - Obey the law, unless that law is made by a tyrant!

[ronsor]

Do those laws even apply to P2P apps without central servers?

[drawfloat]

This is factually untrue and either venting or wilfully ignorant of the actual law.

[florians]

Sweet API design!

[jojohack]

Love it

[jehnnysmith]

HN should add downvote option.