requestAnimationFrame scheduler

rafScheduler.ts

/**
 * A function for batching RAFs together
 */
export default function RAFScheduler() {
  let queue = [];
  let rafId;
  let scheduled = false;
  const DURATION = 10;

  return function scheduleRaf(cb: () => void) {
    queue.push(cb);

    let schedule = () => {
      scheduled = true;
      rafId = requestAnimationFrame(timestamp => {
        let targetEnd = performance.now() + DURATION;
        while(queue.length > 0 && performance.now() <= targetEnd) {
          let task = queue.shift();
          task();
        }
        if (queue.length > 0) {
          schedule();
        } else {
          scheduled = false;
        }
      });
    };

    if (!scheduled) {
      schedule();
    }

    return function cancelScheduledRaf() {
      let index = queue.indexOf(cb);
      if (index > -1) {
        queue.splice(index, 1);
      }
      if (queue.length === 0) {
        cancelAnimationFrame(rafId);
      }
    };
  }
}