JSFiddle - React, Tailwind, and code Playground

HTML

<canvas id="example"></canvas>

JavaScript

function anim(canvas, fps, clear) // класс анимации
{
    var context = canvas.getContext("2d");
    var interval = null;
    var update = null;
    var draw = null;

    this.update = function(func) {
        update = func;
    };

    this.draw = function(func) {
        draw = func;
    };

    var step = function() {
        if (clear) {
            context.clearRect(0, 0, canvas.width, canvas.height);
        }
        if (update !== null) {
            update();
        }
        if (draw !== null) {
            draw();
        }
    };

    this.stop = function() {
        clearInterval(interval);
    };

    this.play = function() {
        if (draw !== null) {
            draw();
        }
        interval = setInterval(step, 10000 / fps);
    };
}

function circle(x, y, r) // класс задающий круг
{
    this.x = x; // координата х
    this.y = y; // координата у
    this.r = r; // радиус
    this.draw = function(context, color, globalAlpha) // метод рисующий круг
    {
        context.globalAlpha = globalAlpha; // "прозрачность"
        context.fillStyle = color; // цвет заливки
        context.beginPath();
        context.arc(this.x, this.y, this.r, 0, Math.PI * 2, true);
        context.fill();
    };
}

function rect(x, y, width, height) // класс прямоугольника
{
    this.x = x; // координата х
    this.y = y; // координата у
    this.width = width; // ширина
    this.height = height; // высота
    // функция рисует прямоугольник согласно заданным параметрам
    this.draw = function(context, color, globalAlpha) {
        context.globalAlpha = globalAlpha;
        context.fillStyle = color;
        context.fillRect(this.x, this.y, this.width, this.height);
    };
}

function init() // инициализация
{
    var screen = new rect(0, 0, 480, 320);
    var ball = new circle(240, 160, 25);
    var vX = 5;
    var vY = 5;
    var canvas = document.getElementById("example");
    canvas.width = screen.width;
    canvas.height = screen.height;
    var context =...