multiplayer-p2p

Implements peer-to-peer realtime multiplayer over WebRTC data channels with database-backed signaling.

Updated Sep 17, 2026
One-click install
npx skills add https://github.com/scomofo/midi-stage2 --skill multiplayer-p2p-scomofo
Or copy as Structured Prompt for Agent▼
Please help me install this Agent Skill.
Skill: multiplayer-p2p
Source: https://github.com/scomofo/midi-stage2/tree/main/.grok/skills/multiplayer-p2p
Command: npx skills add https://github.com/scomofo/midi-stage2 --skill multiplayer-p2p-scomofo

SYSTEM DOCUMENTATION & REQUIREMENTS

💡 This Skill requires zod, and includes references (resource) components.

What problem does it solve? Adding realtime multiplayer to a web app usually means running a stateful WebSocket server that relays every message, adding latency and per-tick server cost. This Skill connects every user directly to every other user through native WebRTC data channels in a full mesh, so game traffic never touches a server and a tiny relay at /api/rtc only brokers the connection handshake. ## Core Features & Use Cases - Full-mesh WebRTC rooms: The P2PRoom primitive joins a rendezvous room and opens data channels to every peer, with unreliable broadcast() for game-rate state and reliable send() for exactly-once events. - DB-backed signaling relay: Copy-paste server files mount a GET poll / POST signal endpoint at /api/rtc that self-creates its tables, prunes stale peers, and works on serverless deployments. - React binding and diagnostics: An optional useP2PRoom hook plus per-peer connectionState, RTT, and candidate-type diagnostics for surfacing NAT failures in the UI. - Use Case: Build a 2-8 player co-op party game or shared-cursor drawing app where all visitors on the same domain automatically play together with browser-to-browser latency of 5-40ms. ## Quick Start Ask the AI to add peer-to-peer multiplayer to the app using the multiplayer-p2p skill, creating the signaling relay and /api/rtc route, then join a room with P2PRoom and broadcast player positions.

Frequently Asked Questions about multiplayer-p2p

High-intent search queries and answers about installing and using this skill.

FAQPage Schema
How do I add WebRTC peer-to-peer multiplayer to a React app?▼

Create the signaling relay and /api/rtc route from the reference files, then instantiate P2PRoom with a room id and callbacks, or copy the useP2PRoom hook. Call join(), then use broadcast() for game-rate state and send() for reliable events.

What is the difference between broadcast and send in WebRTC data channels?▼

broadcast() uses an unreliable, unordered channel for continuously refreshed state like positions, where stale packets can drop. send() uses a reliable, ordered channel for events that must arrive exactly once, such as chat or game-start actions.

Is peer-to-peer multiplayer suitable for competitive ranked games?▼

No. P2P has no server authority, so every peer runs its own copy of the rules and can lie about position or score, and peers learn each other's IP addresses during ICE. Use it only for co-op and casual play among people who choose to play together.

How many players can a WebRTC full-mesh room support?▼

A full mesh is O(N^2) connections, so rooms should be capped at roughly 8 peers. Additionally, about 10-20% of peer pairs sit behind strict NATs and cannot connect, which surfaces as connectionState failed and should be shown in the UI.

Why do WebRTC peers fail to connect behind NATs?▼

Strict or symmetric NATs block direct peer connections for roughly 10-20% of pairs. The kit exposes this per peer as connectionState failed; you can override the STUN server with the VITE_STUN_URLS environment variable and restart the dev server.

How do late joiners get the current game state in a P2P room?▼

Late joiners know nothing, so an existing peer must send() them the current shared state when they appear in the peers list. Exactly one peer answers: compare ids among peers already in the room and respond only if your selfId is the smallest.