The game loop
- Game Development course
- Beginner
- Lesson 4/83
- 4 min
Learn the game loop with its update and render steps.
What Is a Game Loop?
A game loop is a set of basic operations that repeat while a game is running. Through this loop, the game processes player input, updates object states, and prepares new images for the screen.
Game starts
↓
Game loop
↓
Update → Render
↑ |
└────────┘Because the loop repeats continuously, the game world appears animated and interactive.
The Update and Render Stages
The Update stage is where game objects' position, state, and movement information are updated. The Render stage creates the image of the updated game world and draws it on the screen.
Update:
character.x = character.x + 1
Render:
draw character on screenAs these two stages repeat, player movements and visual changes appear on the screen.
Practice Create a Simple Game Loop
Inside the gameLoop function, call update() first and then render(). In this example, both operations should print a message. The order of the messages matters.
Starter code
function update() {
// Güncelleme mesajını yazdır
}
function render() {
// Görüntü mesajını yazdır
}
function gameLoop() {
// İşlemleri doğru sırada çağır
}
gameLoop();Sample solution
function update() {
console.log("Update");
}
function render() {
console.log("Render");
}
function gameLoop() {
update();
render();
}
gameLoop();Expected output
Update Render
Questions and answers
Review the lesson questions together with their answers. To test yourself, solve the lesson interactively.
1 In which stage of the game loop is the character's new position calculated?
- Game installation
- Update Correct answer
- Render
- Screen resolution
Explanation: During the Update stage, the states of characters and other game objects are calculated and updated.
2 Draw the Image on the Screen
function gameLoop() {
update();
____();
}function gameLoop() {
update();
render();
}Explanation: The render function creates the image of the updated game world.
3 Game Loop Concepts
| Term | Meaning |
|---|---|
Game Loop |
Repeated game operations |
Update |
Updates the game state |
Render |
Creates the image |
Framerate |
Number of frames per second |