节流函数不适用于游戏循环中的匀速位移计算——它会丢帧、引入非线性延迟，破坏时间连续性；应使用 requestanimationframe 配合 delta time 实现基于真实时间差的平滑位移。
节流函数本身不适合游戏循环中的匀速位移计算——它会丢帧、引入非线性延迟，破坏时间连续性。真正可靠的方式是用 基于真实时间差（delta time）的更新逻辑，配合 requestAnimationFrame 驱动主循环，而非节流。
为什么节流函数不适用于游戏位移
节流（throttle）强制将回调限制在固定间隔（如 16ms），但实际帧率受设备性能、页面可见性、JS 执行负载影响，requestAnimationFrame 的触发时机本就不严格等于 16.67ms。若强行用 throttle 包裹 update，会导致：
- 帧被跳过或堆积，位移出现“卡顿”或“瞬移”
- delta time 失真：你认为过了 16ms，实际可能已过 40ms，速度 × 时间 = 位移，误差直接放大
- 输入响应延迟不可控，操作手感变差
正确做法：用 requestAnimationFrame + delta time
每帧获取与上一帧的时间差，按实际耗时计算位移：
- 记录上一帧时间戳（initialTime 或 lastTime）
- 在 rAF 回调中获取当前时间 performance.now()
- 计算 delta = current - last，单位毫秒 → 转为秒（/1000）参与物理计算
- 位移 = 速度 × delta（单位：像素/秒 × 秒 = 像素）
let lastTime = performance.now();
const speed = 200; // 像素/秒
<p>function gameLoop(currentTime) {
const delta = (currentTime - lastTime) / 1000; // 秒
lastTime = currentTime;</p><p>player.x += speed * delta; // 匀速位移，无论帧率高低都平滑</p><div class="aritcle_card flexRow artxards">
<div class="artcardd flexRow">
<a class="aritcle_card_img" rel="nofollow" href="/xiazai/skill5980" title="javascript-pro"><img
src="https://img.php.cn/upload/skill/000/000/081/179074807567238.jpg" alt="javascript-pro" onerror="this.onerror='';this.src='/static/lhimages/moren/morentu.png'" ></a>
<div class="aritcle_card_info flexColumn">
<a rel="nofollow" href="/xiazai/skill5980" title="javascript-pro" class="overflowclass">javascript-pro</a>
<p class="overflowclass">专注现代 ECMAScript、异步编程、性能优化和全栈的 JavaScript 专家，适用于现代开发</p>
</div>
<a rel="nofollow" href="/xiazai/skill5980" title="javascript-pro" class="aritcle_card_btn flexRow flexcenter"><b></b><span>下载</span>
</a>
</div>
</div><p>requestAnimationFrame(gameLoop);
}
requestAnimationFrame(gameLoop);
</p>
需要节流的场景？只用于非渲染、低频副作用
如果确实有需限频的操作（如日志上报、网络心跳、调试 UI 更新），可单独节流，但绝不能包裹核心运动逻辑：
- 用 throttle 包裹 console.log 或 API 调用，不影响主循环精度
- 确保节流间隔 ≥ 100ms，避免干扰 rAF 主线程
- 永远不要对 position、velocity、collision 等状态更新做节流
进阶建议：固定 timestep（可选）
对物理模拟要求高的游戏，可采用“累积时间 + 固定步长”方案（如 Box2D 风格）：
- 维护一个 accumulator（累积未处理时间）
- 每帧加 delta，只要 ≥ targetStep（如 1/60s），就执行一次固定步长的 update
- 渲染仍按实际帧率插值，保证视觉流畅和逻辑稳定
这比单纯节流更可控，也比纯 delta time 更利于确定性模拟。
Java免费学习笔记：立即使用
解锁 Java 大师之旅：从入门到精通的终极指南
