Understanding the game loop

A key concept in game design is the game loop. In any game, the code must run over and over again, performing a series of tasks such as input, AI, physics, and rendering. A game loop might look something like this:

while(loop_forever) {
get_user_input();
move_game_objects();
collision_detection();
render_game_objects();
play_audio();
}

An SDL/C++ game targeting almost any platform except WebAssembly would have a while loop, probably located within the main function of the C++ code, that would exit only when the player exits the game. WebAssembly shares its runtime with the JavaScript engine inside your web browser. The JavaScript engine runs on a single thread, and Emscripten uses JavaScript glue code to take what you have done inside SDL within WebAssembly and render that to the HTML canvas element. Therefore, we need to use an Emscripten-specific piece of code for our game loop:

emscripten_set_main_loop(game_loop, 0, 0);

In the next few chapters, we will be adding some of these functions to our game:

  • Game object management
  • Collision detection between game objects
  • Particle systems
  • Enemy spaceship AI using a finite state machine (FSM)
  • Game camera for tracking our player
  • Play audio and sound effects
  • Game physics
  • User interface

These will be functions called from the game loop.