Pong

Pong is a realtime game that pairs players together and starts a match immediately, as soon as there are two players waiting. The ball and both paddles move every tick, so it is the first example that leans on client-side prediction: your own paddle answers your input instantly while the ball and your opponent are interpolated from the server's snapshots.

Move your paddle with the mouse or ↑/↓ · Space to ready up. Open this page in a second browser window to join as the opponent.
Live demo against game.gamehoster.org/pong. Open a second window to play. You can also run it locally (docker compose up --build in src/testing) at http://localhost:8080/examples/pong/. If it says “connecting…”, the game server isn’t reachable.

Code

The whole game is a folder of files. Here is Pong's definition, grouped the way this example's tabs are. Each file links to the tab that shows it in full:

pong/
  gamehoster-game.json
  gamehoster-player/
    gamehoster-player-join-schema.json
    gamehoster-player-schema.json
    gamehoster-player-join.js
    gamehoster-player-leave.js
  gamehoster-instance/
    gamehoster-instance-schema.json
    gamehoster-instance-update-frontend.js
    gamehoster-instance-update-backend.js
  gamehoster-commands/
    moveY/
      gamehoster-command-schema.json
      gamehoster-command.json
      gamehoster-command-handler.js
    ready/
      gamehoster-command-schema.json
      gamehoster-command.json
      gamehoster-command-handler.js
  gamehoster-entities/
    ball/
      gamehoster-entity-schema.json
      gamehoster-entity-update-frontend.js
Pong's definition files. The Game, Player, Instance, Commands and Entities tabs show each in full, and the Frontend tab shows the browser code that runs it.