Fundamentos de jogos de navegador

HTML estrutura, CSS apresenta e JavaScript cria interação. HTML/CSS atende cartas, quizzes e menus; Canvas 2D, sprites e partículas; WebGL, 3D e renderização exigente. Escolha o caminho mais simples que atende à ideia.

Anime com requestAnimationFrame e tempo decorrido:

let previousTime;
 
function frame(time) {
  const delta = previousTime === undefined
    ? 0
    : Math.min((time - previousTime) / 1000, 0.05);
 
  previousTime = time;
  update(delta);
  draw();
  requestAnimationFrame(frame);
}
 
requestAnimationFrame(frame);

O jogo fornece update e draw. O limite reduz saltos ao retornar de uma aba em segundo plano; não é um modelo completo de tempo.

Ofereça alvos de toque confortáveis, teclado quando útil e ações essenciais sem depender de hover. Teste retrato/paisagem cedo, priorize a primeira cena, comprima imagens, use áudio com propósito e mostre o carregamento. Continue com estrutura.