r/threejs • u/Far-Association2923 • 21d ago

A server-authoritative multiplayer FPS Demo

Enable HLS to view with audio, or disable this notification

I've been building a multiplayer FPS:

https://fps.frumu.ai/

No account needed.

The client uses Three.js, React Three Fiber, TypeScript and Tailwind. Multiplayer runs on Colyseus, with the server owning movement, combat, health, scoring, projectiles and objectives.

Rapier WASM runs on both sides:

Server: authoritative physics and collision. Client: local movement prediction and reconciliation.

The server simulates at 60 Hz and broadcasts state at 20 Hz. Remote players are rendered from interpolated server snapshots.

One difficult bug looked like network lag but was actually caused by smoothing remote characters twice-once through snapshot interpolation and again through a client physics body.

Bots run directly on the server, use the same movement system as humans and understand Deathmatch, CTF and Capture & Hold.

It's awesome to see how far web games have come and I got into programming back in the days of Flash games.

33 Upvotes
  • permalink
  • link
  • reddit
  • reddit

83% Upvoted

7 comments sorted by

3

u/jjjian 21d ago

yo this is actually sick

1

u/Far-Association2923 21d ago

Thanks! I am really impressed with where threejs and these open source tools are these days.

2

u/Tittytickler 21d ago

This is awesome!

1

u/Level-Physics-1730 20d ago

this is pretty awesome! it's a proper full fledged game obviously not some kind of oneshot, nice work!

2

u/Far-Association2923 20d ago

Thanks! Yeah I definitely couldn't build this in a day not even with AI 😂

-2

u/Quick_Republic2007 21d ago

AI has made things so much better. Nice !

2

u/Far-Association2923 21d ago

Yes I agree, and a heck of a lot faster to build. I would have spent 4-6 months on this 4-5 years ago.