Play Asteroid Dodge

A fast survival arcade game built with plain JavaScript and canvas. Steer your ship left and right to dodge falling asteroids as the field gets faster. Touch, drag, or keyboard controls.

This is a real, playable game, not a screenshot. Asteroids rain from above and your job is simply to stay alive. The longer you last the faster it gets, so every session is a test of how long you can keep the feedback loop of move, check, react going before a rock catches you.

How to play

Your ship sits near the bottom of the screen and asteroids rain down from above in a field that gets denser every few seconds. Hold the left or right button to slide your ship across the screen, and keep it clear of every rock. There is no shooting here, only survival. Stay alive as long as possible and watch your score climb. A session runs as long as your reflexes hold out, so the goal is always to beat your own best.

Controls

Everything works on any device, from a phone in one hand to a desktop with a keyboard.

Touch and drag

On a phone, hold the left or right button below the canvas or drag your finger across the canvas to steer. The ship follows smoothly so you can make small corrections without lifting your hand.

Keyboard

On a keyboard, hold A or the left arrow to go left and D or the right arrow to go right. The steering accelerates the longer you hold, so quick taps give small nudges.

How this game is built

Asteroid Dodge is a compact tour of the core arcade loop, tying together several techniques in the game development cluster.

Delta time and the game loop

The loop runs on requestAnimationFrame and every movement and spawn is multiplied by the time since the last frame, so the game runs at the same speed on a fast phone and a slow one, the idea at the heart of game loop fundamentals.

Spawning and difficulty

A timer fires every second or so and adds a new asteroid with a random size, horizontal drift, and fall speed. As time passes the spawn interval shortens and the speed ceiling rises, a simple but effective difficulty ramp.

Collision and particles

Each frame the code checks the distance from the ship centre to every asteroid centre. If that distance is less than the sum of the ship half-width and the asteroid radius, the ship is hit, a particle burst fires, and the game ends. The distance check is the same circle collision covered in collision detection, and the input flow follows handling game input.

Why survival games teach great programming habits

Asteroid Dodge is a closed feedback loop: spawn enemies, move everything by delta time, check for collision, update score, repeat. That is the shape of every real time system, from animation engines to data dashboards. Handling the input cleanly so a button held on a phone feels the same as a key held on a keyboard is the same challenge every cross platform UI faces, and it is solved here the same way, by treating both as a shared boolean state. Get this loop solid and you have the skeleton of dozens of more complex games, and a clear mental model for the reactive, state driven thinking behind event driven UI.

Frequently asked questions

How do I play Asteroid Dodge?

Hold the left or right button, or drag on the canvas, to steer your ship away from falling asteroids. Survive as long as possible and beat your own best score.

Does it get harder over time?

Yes. Every few seconds a new level begins, asteroids spawn more frequently and fall faster, so the field fills up and your room to move shrinks.

How is the collision detection done?

Each frame the code measures the straight line distance from the ship centre to each asteroid centre. If that distance is smaller than the ship half-width plus the asteroid radius, a hit is registered.

How does this relate to programming?

It demonstrates delta time movement, a spawn and difficulty ramp, circle collision detection, and cross platform input handling, four fundamentals that appear in almost every real time interactive system.