Pebellslearn by building
0%
RoadmapsMatrixCoursesSandboxSign in
The Game Loop  ›  Lesson

The Game Loop

Client Side Development 12 minEvery frame a game reads input, updates the world by one step and renders the result, then repeats without waiting for the player.

The Game Loop

A calculator app sits idle until you tap a key. Harbour Hopper can't do that: the boats keep sailing, the gulls keep circling and a dropped crate keeps falling whether or not you touch the controls. So at the heart of every game is a loop that never waits for anyone.

The rule

Every frame: read input, update the world, draw it. Repeat.

running = True
while running:
    running = read_input()   # stick, buttons, the quit key
    update_world()           # drone, boats, crates, gulls, score
    render()                 # draw the new state of the world
  • Read input collects everything the player did since the last frame and turns it into intentions: climb, move right, drop the crate.
  • Update applies the game's rules to move the world forward by one step. The drone moves, the boats advance, a falling crate drops a little further, and a crate that touches a deck scores points.
  • Render draws the world exactly as it now is. It only looks; it never changes the game's state.

One pass through the loop is one frame. The order is not arbitrary. Input comes first so that this frame's update can react to the button pressed a moment ago. Render comes last so that the picture shows the world after the update, not a step behind it.

This is the big difference from ordinary apps. A calculator or text editor runs an event-driven loop that sleeps until something happens. A game loop runs flat out, once per frame, even when nothing is pressed, because the world has a life of its own.

The shortcut

To place any piece of game code, ask one question: does it read a device, change the state, or only draw? The answer sorts it into input, update or render.

Sorting Harbour Hopper's codeStep 1 of 4
  1. "Is the drop button down?"

    It reads a device, so it belongs in input.

The classic bug is a state change hiding inside render. Suppose the code that flaps a gull's wings also moves the gull forward, and it sits in the drawing code. Add a split-screen mode that draws the scene twice per frame and every gull suddenly flies twice as fast. Keep render read-only and this bug can't exist.

Drills

Answer fast — trust the rule.

quick drill

In what order does a basic game loop run its stages each frame?

quick drill

Which stage should hold score += 10 for a crate landing on a boat?

quick drill

Why can't Harbour Hopper sleep until the player presses something, the way a text editor does?

quick drill

Gulls fly twice as fast in split-screen mode, which draws the scene twice per frame. What is the likely cause?

Remember

  • Every frame: read input, update the world, draw it — then go round again.
  • Sort code by asking: does it read a device, change state, or only draw?
  • Render is read-only: state changes hidden in drawing code break when the scene is drawn more or less often.

Practice — level up

0/1 solved

Write your answer, then compare it with a rubric and a model answer.

ExplainOne frame, three stages

Describe one frame of Harbour Hopper in which the player presses "drop" while the drone is above a boat. Say what happens in each of the three stages, and explain why the stages run in that order.