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.
Reset ball position and velocity, paddle position, bricks and their hit points, score, lives, level, timers/accumulators, pause/game-over flags, and any held-key or pointer state. Keep listener functions stable so removal uses the same function reference. Four checks: restart repeatedly and confirm one update per frame; hold a key through restart and confirm no stuck movement; restart during a pending animation frame and confirm the old frame does not mutate state; restart after win/loss and confirm score, lives, bricks and status return to initial values. This is a recommended pattern, not a tested implementation.


