La page
<canvas width="400" height="400"></canvas>
<script src="jeu.js"></script>
La boucle de jeu
function boucle() {
mettreAJour(); // positions, collisions, score
ctx.clearRect(0, 0, 400, 400);
dessiner();
requestAnimationFrame(boucle);
}
boucle();
Améliorer
- Vitesse indépendante de l'écran : utiliser le temps écoulé (paramètre de
requestAnimationFrame). - Images :
ctx.drawImage(); sons :new Audio(). - Meilleur score : localStorage.
- Moteurs de jeu : Phaser, Kaboom.
Bases : événements.