уменьшить/thottle requestAnimationFrame для анимации холста

Question

im создает анимацию холста HTML5 и хочет уменьшить/уменьшить частоту кадров. В настоящее время я использую метод requestAnimationFrame. Чтобы уменьшить частоту кадров, я использую setTimeout.

Есть ли лучший/более эффективный способ сделать это?

// Game - animation loop 
     var fps = 5; 
     function step() { 
     setTimeout(function() { 
      update(); 
      draw(); 
      window.requestAnimationFrame(step); 
     }, 1000/fps); 
     } 

Благодаря

Answer 1

const fps = 5; 
const delay = Math.ceil(1000/fps); 
let last = Date.now(); 
let now; 

function step() { 
    now = Date.now(); 
    if(now - last < delay) { 
     return requestAnimationFrame(step); 
    } 
    last = now; 
    update(); 
    draw(); 
    requestAnimationFrame(step); 
} 

step();