Do calls to requestAnimationFrame stack?

  animation, canvas, html, javascript, recursion

I have the following functions

function render() {
  init = timeStep(init)
  if (steps <= yQuotient) {
    requestAnimationFrame(render)
  }
}

export function fire() {
  setup();
  render();
}

I then call fire() whenever I need to start/restart the application. My question is whether this will result in multiple requestAnimationLoop()‘s active simulatenously as they build up like eventListeners do when called repeatedly, presumably affecting performance.

Do I need to amend my fire() function to something like this?

export function fire() {
  cancelAnimationFrame(render)
  setup();
  render();
}

Or does requestAnimationLoop() just automatically know to end it’s current loop when a new one is started?

Source: Ask Javascript Questions

LEAVE A COMMENT