JSFiddle - React, Tailwind, and code Playground

HTML

<canvas id="canvas" width="200" height="200"></canvas>

CSS

#canvas{border:1px solid #ccc;}

JavaScript

window.requestAnimFrame = (function() {
    return window.requestAnimationFrame
            || window.webkitRequestAnimationFrame
            || window.mozRequestAnimationFrame
            || window.oRequestAnimationFrame
            || window.msRequestAnimationFrame || function() {
                //return setTimeout(arguments[0], 1000 / 60);
                return -1;
            } // return -1 if unsupported
})();

window.cancelRequestAnimFrame = (function() {
    return window.cancelAnimationFrame
            || window.webkitCancelRequestAnimationFrame
            || window.mozCancelRequestAnimationFrame
            || window.oCancelRequestAnimationFrame
            || window.msCancelRequestAnimationFrame || function() {
                return -1;
            } // return -1 if unsupported
})();
    
var ctx = document.getElementById('canvas').getContext('2d');
ctx.fillStyle = '#f00';
ctx.fillRect(0,0, 10, 10);