8×4 GRID · 32 BRICKS · 3 LIVES · MAX 320

BREAKOUT

One file. Zero libraries. A 400×600 canvas, an AABB resolver and a fixed 60 Hz physics step.

SCREEN 400 × 600MODE READY

Operator’s Manual

The ball carries a constant magnitude between 3.44 and 4.00 px per frame. Paddle bounces are re-derived from the hit offset — strike the edge and it leaves at up to 62°; strike the centre and it goes straight back up. Brick hits resolve on the axis of least penetration, one brick per frame, with the body pushed clear of the grid so nothing ever sticks.

  • ←→Glide the paddle — A / D also work
  • SPACELaunch the ball · resume from pause
  • PPause / resume the run
  • RRebuild the 8×4 wall
  • DRAGOn touch screens: the paddle tracks your finger
  • TAPTap the playfield to launch or restart
Grid
8 cols × 4 rows
Brick cell
50 × 20 px
Paddle
60 × 10 @ y580
Paddle travel
0 – 340 px
Ball radius
3 px
Launch vector
(2, −2.8) norm.
Brick value
+10 pts
Cabinet
#1a1a1a / #00ffff
VANILLA JS + CANVAS 2DrequestAnimationFrame · FIXED 60HZ STEP320px+ · PORTRAIT & LANDSCAPE