正确暂停游戏需中断 requestanimationframe 调用链并取消上一帧回调，同步清理事件监听、禁用 canvas 交互、保存绘图状态，并将 ispaused 等状态作为游戏类实例属性管理。
暂停时如何正确冻结游戏主循环
核心是中断 requestAnimationFrame 调用链，而不是仅靠布尔标志位跳过逻辑——否则动画帧仍在消耗 CPU，音频可能继续播放，输入事件也未被拦截。
常见错误是只写 if (!isPaused) { update(); render(); }，但 requestAnimationFrame 本身还在递归调用，导致“假暂停”。
- 暂停时必须显式取消上一帧的回调：
cancelAnimationFrame(animationId) - 恢复时重新调用
requestAnimationFrame(gameLoop)启动新帧，而非继续旧引用 - 若使用
setInterval或 Web Worker 做定时逻辑，也要同步clearInterval或发送暂停消息
状态变量该存在哪？全局、类属性还是 DOM data-*？
游戏运行状态（如 isPaused、gameState）应作为游戏主类的实例属性，而非全局变量或塞进 data-* 属性里。前者便于类型检查和 IDE 提示，后者易被误操作或 DOM 操作意外覆盖。
DOM 的 data-* 仅适合存 UI 相关的瞬态标记，比如 data-ui-state="paused" 用于 CSS 切换遮罩层可见性，不参与逻辑判断。
立即学习“前端免费学习笔记（深入）”；
