canvas animation

gameOfLife.js animation

// We must initialize the animate method in constructor
constructor() {
   super();
   this.animate = this.animate.bind(this);
}

onPlay() {
  // Run animation
  this.animate();
}

lastRenderTime = 0;
speed = 200; // milliseconds
animate(timestamp = 0) {
    // current LWC supported methods
    const requestAnimationFrame = window.requestAnimationFrame || window.webkitRequestAnimationFrame;
    this.interval = requestAnimationFrame(this.animate);
    // interval speed control
    const delta = (timestamp - this.lastRenderTime);
    if (delta < this.speed) {
        return;
    }
    this.lastRenderTime = timestamp;
    // Do Something
    this.nextGeneration();
}

onStop() {
    window.cancelAnimationFrame(this.interval);
    this.interval = false;
}