вычислить частоту кадров в html5 холсте с помощью javascript

Question

Я создаю html5 холст и хочу проверить, сколько кадров проходит за одну секунду. Я попытался использовать новый Date (), и он не работает. Как бы мне удалось это сделать? шаблон javascript / пример:

var fps;
function loop(){
    //some code

    window.requestAnimationFrame(loop);
}
function checkFrameRate(){
    fps = //how long it takes for loop to run
    window.requestAnimationFrame(checkFrameRate);
}
loop();
checkFrameRate

Answer 1

В функции цикла проверьте время, прошедшее между выполнениями.

let lastTime = new Date();
function loop() { 
    const currentTime = new Date();
    // currentTime - lastTime is the number of milliseconds passed from last loop 
    const fps = 1000 / (currentTime - lastTime);
    lastTime = currentTime;
}