BREAKOUT

CAB №07 · ONLINE 8×4 GRID 32 BLOCKS 60 HZ FIXED STEP 0 DEPENDENCIES
INSERT COIN — 00:00 UPTIME · CANVAS 2D · VANILLA JS

Monitor / 400×600


STANDBY
READY

BREAKOUT

Thirty-two blocks. Three balls.

TAP SCREEN · CLICK · SPACE

Thirty-two blocks.
Three balls.
One 400×600 field.

Hand-rolled collision code — no physics engine, no libraries. Every bounce resolves through an axis-aligned bounding box, gets pushed out along its minimum translation vector, and re-normalises against a fixed speed so the ball never drifts out of spec.

01

The paddle is a steering wheel

Hit position decides the exit angle: θ = rel × 60°, with a nudge from paddle velocity. Centre contact sends it straight up, edge contact rakes it sideways at up to ±60°. A still paddle nudges dead-centre hits off-axis so the ball can't lock into a vertical loop.

02

One impact per frame

Every substep collects all overlapping blocks, keeps the deepest one, and resolves only that. Overkill on one frame costs one block, awards 10 points, and never double-flips the velocity — the classic stuck-in-a-row bug that traps the ball inside the wall.

03

No tunnelling, even on a stutter

Movement splits into substeps of ≤2px against a 20px-tall block, and a fixed 16.67 ms accumulator keeps the feel identical at 60, 90 or 120 Hz. Long frames run at most five catch-up ticks, then drop time.

04

Sealed edges

Paddle clamped to 0–340. Park it against a wall and the paddle seals the gap: a ball falling beside it is pushed back into play instead of slipping through. Side faces of the paddle reflect dx, the top face reflects dy — chosen by the shallower penetration axis.

Field
400 × 600
Grid
8 × 4 @ 50×20
Block band
y 80 → 160
Max clear
320 + 150 bonus
Paddle
60 × 10 @ y580
Ball
r3 @ 200,570
Launch vector
+2.00, −2.80
Step · substep
16.67ms · 2×
Collision
AABB + MTV
Lives
3
Audio
WebAudio synth
Libraries
none