Javascript多人游戏-用于游戏/物理逻辑的requestAnimationFrame吗？

Question

我正在开发一个基于Javascript的多人游戏。到目前为止，我已经准备好基本的服务器，客户端和网络。

我确实遇到了一个问题，我的播放器在120Hz屏幕上的移动速度比60Hz屏幕快。我已经通过将玩家的移动速度乘以'requestAnimationFrame'的变化时间来解决此问题。

然而; 将动画与逻辑分离是更好的解决方案吗？

如：

//Game loop; Do each 1/60th of a second
setInterval(gameTick, 1000/60);
function gameTick(){
  player.handleKeys();
  enemies.foreach( (enemy) => {
    enemy.update();
  });
}

//Draw loop; match to player screen refresh rate
window.requestAnimationFrame(gameLoop);
function gameLoop() {
    player.draw();
    enemies.foreach( (enemy) => {
    enemy.draw();
  });
  window.requestAnimationFrame(gameLoop);
}

尽管差异可能是“可以忽略的”，但我想避免使用240Hz服务器向服务器“发送垃圾邮件”的播放器，并且要比其他播放器更具优势。

另一方面，对于240Hz显示器；您的键盘输入只有4帧中的1帧会被处理，因此感觉不那么流畅吗？

我要问的原因是，这将是一场竞争性游戏，因此应保持平衡。但是我检查了各种似乎一致同意使用requestAnimationFrame的资源（即使是逻辑；不仅是图形），尽管我对此表示怀疑，并想知道哪个是正确的（和/或用于专业人士）。竞技游戏）。

Answer 1

requestAnimationFrame(rAF) 只会以最大 60 fps 的速率发射。（例外一些浏览器的一些旧版本有关闭 VSync 的标志，这确实影响了 rAF）

笔记

• rAf，setTimeout或者setInterval不可靠，并且可能由于多种原因丢帧。

• 如果选项卡或窗口隐藏或（选项卡）未聚焦，rAF 将停止触发。

• setIntervalsetTimeout如果选项卡或窗口隐藏或（选项卡）未聚焦，则会受到限制。

• rAF 时间参数并不代表（下一个显示的）帧的时间，而是代表调用 rAF 回调的时间。

  这意味着...

  • 如果根据 rAF 时间参数计算，帧之间的时间将浮动，并且不能可靠地用作增量时间。
  • time 参数表示调用时间，而不是呈现给显示器的帧时间，并且最多可以比呈现的内容呈现给显示硬件早 < 1/60 秒。

本地网络

对于多人游戏，服务器应该提供时间，以便所有玩家都在共同且可靠的时间戳上运行。客户端可以从上一个时间戳向前预测时间，以避免网络延迟数据包时冻结，但应在收到时恢复到同步（服务器时间）时间。

大型网络

通信取决于距离，即使在完美的点对点网络上，如果客户端位于世界的另一端，由于光传输时间，最佳 ping 可能为 130 毫秒（接近 8 帧 @60Hz）。这不包括数据包交换和实际路由长度。一般来说，到地球上最远​​点的 ping 时间约为 300 毫秒。

对于专业游戏来说，必须考虑这种延迟，这就是为什么许多多人游戏提供本地服务器，并限制某些服务器上的玩家（如果距离较远）的原因。300 毫秒给距离较近的玩家带来了显着的优势。

使用浏览器 API 托管客户端的实时多人游戏最多也会出现问题，因为浏览器是不可靠且不一致的客户端主机，这主要是由于客户端运行的设备范围广泛。

顺便提一句

window是默认值this( globalThis)，因此不是必需的。例如window.requestAnimationFrame等同于requestAnimationFrame