JSFiddle - React, Tailwind, and code Playground

HTML

<canvas id="game_field" width="512" height="500">
            Your browser  doesn't support canvas!
        </canvas><br>
    score: <span id="score">0</span><br>
    level: <span id="level">1</span><br>
    lives left: <span id="lives">3</span>

CSS

#game_field {
	border: 1px solid black;
        border-top: 4px solid black;
        border-left: 4px solid black;
        cursor: none;
}

JavaScript

function Game() {
    this.fps = 60;
    //this.canvas = document.getElementById('game_field');
    //this.canvas.width = this.canvas.height = 500;
    var canvas = document.getElementById('game_field');
    this.height = 500;
    this.width = 512;
    this.canvasUtil = new CanvasUtil(canvas);
    //this.ctx = this.canvas.getContext('2d');
    this.stage = 1;
    this.lives = 3;
    this.totalScore = 0;
    this.paused = true;
    this.lastRender = 0;

    var bate = new Bate(this);
    //bate.placeAt(256 - bate.width / 2, 450);
    this.bate = bate;
    this.balls = [];
    var ball = new Ball(this);
    ball.placeAt(256 - ball.radius, 450 - ball.height);
    this.balls.push(ball);
    this.levels = {
        1: [
            ['b', 0, 0, 0, 0, 0, 0, 0],
            ['g', 'g', 0, 0, 0, 0, 0, 0],
            ['y', 'y', 'y', 0, 0, 0, 0, 0],
            ['w', 'w', 'w', 'w', 0, 0, 0, 0],
            ['o', 'o', 'o', 'o', 'o', 0, 0, 0],
            ['p', 'p', 'p', 'p', 'p', 'p', 0, 0],
            ['u', 'u', 'u', 'u', 'u', 'u', 's', 's']
        ],
        2: [
            [0, 0, 0, 0, 0, 0, 0, 0],
            [0, 0, 0, 0, 0, 0, 0, 0],
            [0, 0, 0, 's', 's', 0, 0, 0],
            [0, 0, 's', 'o', 'o', 's', 0, 0],
            [0, 's', 'g', 'g', 'g', 'g', 's', 0],
            [0, 's', 'y', 'y', 'p', 'p', 's', 0],
            [0, 's', 'a', 'a', 'a', 'a', 's', 0],
            [0, 0, 's', 'p', 'p', 's', 0, 0],
            [0, 0, 0, 'u', 'u', 0, 0, 0]
        ]
    };


    this.renderLevel();
    this.collisionResolver = new CollisionResolver(this);

}

Game.prototype.gameloop = function() {

    var current = new Date().getTime(),
            delta = current - this.lastRender;

    if (delta >= this.delay && !this.paused) {
        //console.log('hi');
        this.updateAll();
        if (this.paused)
            return;
        this.drawAll();
        this.lastRender = new Date().getTime();
    }
    //var game = this;
    //console.log(this);
    this.loop =...