JSFiddle - React, Tailwind, and code Playground

HTML

<canvas id="canvas" width="800" height="600"></canvas>

JavaScript

var canvas=document.getElementById('canvas');
var ctx = canvas.getContext('2d');
var imageData = ctx.createImageData(canvas.width, canvas.height);

setInterval(function() {
	var time = Date.now()/10;
  console.log(time)

  for(var i=0; i<imageData.width; i++) {
      for(var j=0; j<imageData.height; j++) {
          tmp = ((imageData.width * j) + i) * 4;
          imageData.data[tmp] = 0;
          imageData.data[tmp + 1] = 0;
          imageData.data[tmp + 2] = 127*Math.sin(i/100)+128;
          imageData.data[tmp + 3] = 255;
      }
  }

  ctx.putImageData(imageData, 0, 0);
}, 1000/60);