Play Pong: A Local Multiplayer Game

A two player game on one keyboard, built with the HTML canvas and plain JavaScript. Grab a friend, play, then read how it works and how networked multiplayer differs.

This is a real, runnable game for two people sharing a screen. It uses the same building blocks as a solo game, with two paddles instead of one. After you play, the sections below explain how it is built and, importantly, how a networked version over the internet would differ.

How to play

This is a game for two people on one keyboard. The left player moves with the W and S keys, and the right player moves with the up and down arrow keys. Press Space or tap Start to serve. Each time the ball gets past a paddle, the other player scores, and the first to five points wins. The ball speeds up slightly on every paddle hit, and the angle it leaves depends on where it strikes, so placement matters more than reflexes.

How this game is built

The core is the same as the solo game, with one change: two paddles, each driven by its own player. Each part maps to an article in the cluster.

The shared game loop

One requestAnimationFrame loop updates both paddles and the ball, then redraws everything, the cycle described in game loop fundamentals.

Two players, one keyboard

Two separate key sets feed two paddle states in the same input handler, an extension of handling game input.

Ball and paddle collisions

Edge checks bounce the ball off the top and bottom and off each paddle, with the rebound angle set by the hit position, covered in collision detection.

Scoring and rounds

Each miss increments a score and serves a new ball until someone reaches five, the kind of phase tracking in game state management.

From local to networked multiplayer

Turning this into networked multiplayer, where each player sits at their own device, is a separate discipline. The moment two machines are involved, you face network delay, players acting on slightly different views of the game, and the need to agree on one true state. The techniques that solve this, client prediction, server reconciliation, and keeping clients synchronized, are covered in multiplayer game netcode and across the interactive web cluster, which treats the same realtime problems for collaborative apps. Master the local version first, then add the network layer.

Frequently asked questions

How do two players control the game?

On one keyboard: the left player uses W and S, and the right player uses the up and down arrow keys. Both paddles move at the same time, so two people can play together.

Is this networked multiplayer?

No. This is local, shared screen multiplayer with no network involved, which keeps the game in perfect sync. Networked play over the internet adds delay and needs the netcode covered in a separate article.

How does the ball physics work?

The ball moves by a velocity that bounces off walls and paddles. On a paddle hit it speeds up slightly, and the rebound angle is set by where on the paddle it lands, so you can aim.

How would I make this work over the internet?

You would add a network layer with client prediction and server reconciliation so the two machines agree on one game state despite delay. That netcode is the subject of its own article in the cluster.