Como fazer o clássico jogo da cobra funcionar de verdade
A maioria dos tutoriais que você vê na internet ensina uma versão tão simplificada que ela quebra no primeiro minuto. O jogo da cobra parece óbvio: uma cobra que se move, come uma maçã e cresce. A dificuldade real está em lidar com colisões, frames e edge cases que todo mundo ignora até dar problema. Vou mostrar como eu construí uma versão que não trava quando a cobra bate na própria cauda em ângulos diferentes, usando JavaScript puro com requestAnimationFrame e um grid-based movement system. O resultado foi um jogo rodando estável por meses sem bugs visíveis.
Por que o joguinho da cobra é mais complicado do que parece
O erro mais comum é mover a cobra frame a frame usando coordenadas contínuas. Isso funciona até o jogador apertar duas teclas rapidas demais e a cobra atravessar seu próprio corpo sem colisão detectada. Eu descobri isso na terceira semana de desenvolvimento, quando testei com inputs rápidos e a cobra simplesmente passou por si mesma. A solução foi usar um sistema baseado em grid fixo onde a posição da cobra é sempre um múltiplo do tamanho da célula. Assim, a colisão fica uma simples comparação de coordenadas inteiras. Outro problema que quase ninguém menciona: a velocidade. Muitos tutoriais aumentam a velocidade diminuindo o intervalo entre frames, mas isso cria um bug onde a cobra se move mais rápido que a detecção de colisão consegue acompanhar. O workaround que eu usei foi separar a lógica de movimento da lógica de renderização. O movimento roda num timer fixo de 120ms, enquanto o render usa requestAnimationFrame para manter 60fps suaves. Assim a velocidade aumenta sem quebrar a detecção.
👉 Clique no botão abaixo para saber mais sobre o assunto!
Se você quer tentar, posso te indicar alguns links de repositórios open source que implementam essas técnicas corretamente. O código fonte costuma ser bem mais didático do que qualquer vídeo tutorial porque mostra exatamente como as variáveis de estado são gerenciadas entre frames.
Dificuldade progressiva e o problema do final de jogo
Um detalhe que causa frustração: quando a cobra preenche 95% do grid, o jogo fica impossível de ganhar porque sobra espaço insuficiente para manobrar. Eu resolvi isso adicionando um modo "hardcore" onde a cobra pode atravessar paredes e aparecer do outro lado, o que mantém o jogo jogável mesmo com o corpo grande. Para quem prefere o clássico, a alternativa é limitar o tamanho máximo da cobra em cerca de 70% do grid, forçando o jogador a buscar a maçã com estratégia em vez de apenas crescer indefinidamente. Não existe solução perfeita para Snake. O jogo é fundamentalmente um quebra-cabeça de espaço que fica progressivamente mais difícil até o ponto de impossível. A maioria dos clones modernos resolve isso adicionando power-ups ou obstáculos móveis, mas isso perde a essência do jogo original. Se o objetivo é apenas uma versão jogável e bem implementada, o grid fixo com timer separado já resolve 90% dos problemas que os iniciantes enfrentam.
