动画、FPS 和 KineticJS

Question

我有一个小游戏，屏幕上会有一个球在移动，我希望能够计算出它的FPS。我正在使用KineticJS（版本为4.3.1），该库基于requestAnimationFrame。

      var anim = new Kinetic.Animation(
          function(frame) {

            //game logic
               //move ball
               //check collisions - if collision occurs, stop animation
               //redraw 

          }
      }

'frame'对象具有一个time属性，可以通过frame.time访问，该属性以毫秒为单位测量自动播放开始后的时间。

     var timeSinceAnimationStarted = frame.time;

如何准确地测量FPS？

- SoluableNonagon

---

此外，这个动画可能会一直播放下去，除非检测到碰撞才会停止。 - SoluableNonagon

显而易见的答案应该是frames_displayed / seconds_of_measurement……为什么你不使用它？设置一个计时器。每次显示一帧时递增一个计数器。当计时器响起时，查看经过了多长时间以及渲染了多少帧。 - tucuxi

谢谢您的迅速回复，但基本上是因为我以前没有做过这个，需要一些指导来确定变量放在哪里。但从您所说的，结构应该是创建一个变量（称之为numFrames），它会随着动画递增，并且一个计时器每秒读取该值。对吗？ - SoluableNonagon

不需要计时器，实际上 - 请参见我下面的答案。 - tucuxi

在最近版本的Kinetic中，frame对象具有帧速率属性：frame.frameRate。 - Luke

是的，我看到了，它非常不错。 - SoluableNonagon

Answer 1

一个简单的实现方式是“每秒钟使用帧”。你可以通过使用5秒间隔的帧来使其更加平滑。

// variables accessible from within function(frame)
var frameCount = 0;
var currentSecond = 0;
var frameRate = 0;

// within function(frame), called with current time on each new frame
function updateFrameRate(time) {
    var second = Math.floor(time / 1000); // ms to integer seconds
    if (second != currentSecond) {
       frameRate = frameCount;
       frameCount = 0;
       currentSecond = second;
    }
    frameCount ++;
}

- tucuxi

---

谢谢，我稍后会测试一下。 - SoluableNonagon

这个很好用，但如果我想在某个地方显示帧率，它并不完全准确，因为数字会不断增加。 - SoluableNonagon

我的意思是，我正在寻找“最近1秒的帧速率是多少？”或者当前的帧速率。 - SoluableNonagon

抱歉，忘记为新的一秒重置frameCount。 - tucuxi

Answer 2

所提出的结构似乎是：

  var numFrames = 0;
  var anim = new Kinetic.Animation(
      function(frame) {

        //game logic
           //move ball
           //check collisions - if collision occurs, stop animation
           //redraw 
        numFrames++;
      }
  }

  setInterval(function(){
     alert(numFrames/1000);  //number of frames per second
     numFrames = 0;  //reset frame count
  },1000);   //every second

这会是这种情况吗？

- SoluableNonagon

---

等等，我在警告框中应该除以1000吗？基本上是按毫秒还是秒除？ - SoluableNonagon

不要每秒触发警报；无论如何，我相信JS时间戳是自纪元以来的毫秒数。 - tucuxi