How should I prevent duplicate animation loops and input listeners when restarting a small HTML canvas brick-breaker game? Give a minimal lifecycle pattern, list the game state that must reset, and provide four checks that expose restart bugs. Do not produce a complete game or claim the pattern has been run.
Clear held inputs on window blur too. Keep game-over rendering inside this loop rather than starting another. Reset: Ball position/velocity; paddle position/velocity; fresh brick layout and hit points; score, lives, level; running/paused/win/loss flags; held keys/pointer state; elapsed time, physics accumulator, cooldowns and effects. Cancel other timers or invalidate their callbacks using the epoch. Four checks: Restart rapidly 20 times: instrument callbacks; speed and updates per frame must not multiply. Restart repeatedly, then press/release once: each registered input handler should fire once per event. Restart while moving, paused and after losing: no stuck movement, stale overlay, damaged bricks or time jump. Unmount/remount: old callbacks must stop; only the new controller should respond.


