Play Bug Squash

A fast, colorful reaction game built with plain JavaScript and canvas. Squash the bugs, spare the good code, and beat the clock. Play solo or duel a friend.

This is a real, playable game, not a screenshot. Bugs pop up across the field and you tap them to squash them before they vanish, while leaving the green good code alone. It is built with no library, just a render loop, pointer events, and a little hit testing, which makes it a clean example of responsive input. After you play, the sections below show how it works.

How to play

Red bugs keep appearing in the code. Tap or click each one to squash it before it scurries away, and every squash adds to your score with a rising combo for fast, accurate hits. Watch out for the green good code: tapping that costs you points and resets your combo, so aim carefully. The whole thing lasts 30 seconds and speeds up as the clock runs down. In Solo you chase your best score. In the 2 player duel the screen splits down the middle and each player squashes bugs on their own half at the same time, with the higher score winning.

How this game is built

Under the cartoon bugs, this is a clean lesson in events, timing, and hit testing.

Spawning on a timer

The loop checks the clock and drops a new bug once enough time has passed, and that interval shrinks as the round goes on. That steady cadence comes straight from game loop fundamentals.

One pointer event for mouse and touch

A single pointer event handles a mouse click and a finger tap with the same code, and because each finger fires its own event, two players can tap at once. That is the unified input idea in handling game input.

Hit testing a tap

When you tap, the code measures the distance from your finger to each bug and squashes the one you hit, the same distance check behind collision detection.

Score, combo, and the clock

Points, the combo multiplier, the timer, and the two player split are all plain values the rest of the code reads and the screen reflects, the heart of game state management.

Why fast event handling matters

A game that feels responsive and an app that feels responsive are built the same way. Both must turn a raw input, a tap or a click, into the right action immediately, and both must stay smooth when events arrive in bursts. That is why real interfaces lean on careful pointer handling and the kind of event flow described in event driven UI. Squashing a bug the instant you tap it is that responsiveness made visible.

Frequently asked questions

How do I play Bug Squash?

Tap or click the red bugs to squash them for points, and avoid tapping the green good code, which costs points. The round lasts 30 seconds and gets faster as it goes.

What is the 2 player duel?

The screen splits in half and two players squash bugs on their own side at the same time, which works best on a touch screen where both can tap together. The higher score at the end wins.

Why do I lose points for the green ones?

The green circles are good code, not bugs. The penalty rewards accuracy over mashing, so reading before you tap is part of the skill.

How does this relate to real programming?

It is a small model of event handling: turning a tap into an immediate action, testing what was hit, and keeping score in state. Responsive apps process pointer events the same way.