Personal project / Fighting game
Rift Clash.
Launch them, juggle them, then cash the damage in and knock them off the stage.
My work
Game design, the deterministic simulation and combo system, rollback netcode, procedural animation and the lobby service.
Working with
JavaScript · Canvas 2D · WebRTC · Rollback netcode · Node ws · Fly.io
Inside the build
Frame-exact fights between two browsers.
Context
Two browsers on different networks must agree on every frame of a fast fighting game without making either player wait.
How it works
The simulation uses only exactly specified arithmetic and snapshots its whole state every frame, so a wrong input prediction is repaired by replaying up to nine frames. Juggle hits apply a small lift; only an ender turns accumulated damage into knockback.
In the work
60 automated tests cover determinism, trades, grabs, counters, frame advantage and desync detection. Two browsers matched every compared frame checksum over a direct connection and over the relay, and simulated links hold full speed up to about 230 ms of ping with 8% packet loss.
- Combat
- Each move’s frame advantage is measured by simulation. No grounded move is minus on hit, nothing is better than +1 on block, and simultaneous hits trade instead of favouring player one.
- Netcode
- Players connect directly over WebRTC when their networks allow it and relay through the lobby server when they do not. A hash of the simulation code keeps mismatched builds out of the same room.
- Animation
- Attacks are animated from their frame data: a limb winds up during startup and reaches the hitbox on the active frames, so the animation shows exactly where a move hits.
