SyncLab

SyncLab exists to make a hard-to-explain systems problem visible and feel-able: how can a client respond instantly when the server still owns the truth? It began with the smallest multiplayer interaction that could carry the point, two circles in a bounded arena with tag transferring on touch, deliberately forgettable rules so the networking behavior is the entire point. It's built for engineers, or engineering-curious learners, who want to feel prediction, reconciliation, and interpolation happen under real, adjustable network conditions instead of reading about them abstractly.SyncLab exists to make a hard-to-explain systems problem visible and feel-able: how can a client respond instantly when the server still owns the truth? It began with the smallest multiplayer interaction that could carry the point, two circles in a bounded arena with tag transferring on touch, deliberately forgettable rules so the networking behavior is the entire point. It's built for engineers, or engineering-curious learners, who want to feel prediction, reconciliation, and interpolation happen under real, adjustable network conditions instead of reading about them abstractly.

SyncLab is a pnpm-workspace monorepo: a Next.js 16 / React 19 client, a standalone Node.js server on raw ws with no game engine, database, or auth, and a shared package of pure functions (movement, reconciliation, interpolation, protocol guards) imported by both sides so client prediction and server simulation can never drift into two implementations. The server runs a 30Hz fixed-timestep accumulator loop, with capped catch-up steps guarding against event-loop stalls, and broadcasts authoritative snapshots at 20Hz on its own accumulator. A network-simulator layer sits in front of the WebSocket in both directions and deterministically delays or drops whole messages per room. It works at the message layer, not the packet layer, which buys reproducible, deterministic scenarios at the price of never reproducing partial-packet behaviour the way real UDP or TCP would. The core mechanism is the reconcile step: on each snapshot, the client restores the server-acknowledged position, discards inputs at or below that sequence number, and replays only the unacknowledged ones through the same shared movement function: deterministic correction, not interpolated guessing.SyncLab is a pnpm-workspace monorepo: a Next.js 16 / React 19 client, a standalone Node.js server on raw ws with no game engine, database, or auth, and a shared package of pure functions (movement, reconciliation, interpolation, protocol guards) imported by both sides so client prediction and server simulation can never drift into two implementations. The server runs a 30Hz fixed-timestep accumulator loop, with capped catch-up steps guarding against event-loop stalls, and broadcasts authoritative snapshots at 20Hz on its own accumulator. A network-simulator layer sits in front of the WebSocket in both directions and deterministically delays or drops whole messages per room. It works at the message layer, not the packet layer, which buys reproducible, deterministic scenarios at the price of never reproducing partial-packet behaviour the way real UDP or TCP would. The core mechanism is the reconcile step: on each snapshot, the client restores the server-acknowledged position, discards inputs at or below that sequence number, and replays only the unacknowledged ones through the same shared movement function: deterministic correction, not interpolated guessing.

Public and live at Public and live at synclab.javiertpadilla.com, the Next.js client on Vercel with the ws server on Railway behind it, exactly the split vercel.json and railway.json were built for. The full loop ships: the two-player arena, all three netcode systems independently toggleable, the four network presets plus continuous latency/jitter/loss sliders, and the optional ?debug=true reconciliation overlay., the Next.js client on Vercel with the ws server on Railway behind it, exactly the split vercel.json and railway.json were built for. The full loop ships: the two-player arena, all three netcode systems independently toggleable, the four network presets plus continuous latency/jitter/loss sliders, and the optional ?debug=true reconciliation overlay.

The README is honest about SyncLab's edges rather than hiding them: it states plainly that the simulator delays and drops application messages rather than emulating real UDP/TCP packet behavior, that the room process is single-instance and in-memory with no cross-region coordination, and that there's no lag compensation because the only interaction is proximity tagging. Test coverage stops at the shared math and one server validation test; game-client.ts (520 lines) and the network simulator have none. There's a small doc/reality gap too: the README says to copy apps/web/.env.example to .env.local, but no .env.example exists in apps/web, so I had to hand-write the env file to run it. The decision I'd keep regardless is the shared-package movement function: it's the one thing preventing client and server from silently diverging, and it's the reason the reconciliation demo is trustworthy instead of just plausible-looking.The README is honest about SyncLab's edges rather than hiding them: it states plainly that the simulator delays and drops application messages rather than emulating real UDP/TCP packet behavior, that the room process is single-instance and in-memory with no cross-region coordination, and that there's no lag compensation because the only interaction is proximity tagging. Test coverage stops at the shared math and one server validation test; game-client.ts (520 lines) and the network simulator have none. There's a small doc/reality gap too: the README says to copy apps/web/.env.example to .env.local, but no .env.example exists in apps/web, so I had to hand-write the env file to run it. The decision I'd keep regardless is the shared-package movement function: it's the one thing preventing client and server from silently diverging, and it's the reason the reconciliation demo is trustworthy instead of just plausible-looking.