JSFiddle - React, Tailwind, and code Playground

HTML

<div id="content"></div>

JavaScript

"use strict";

/*global $*/

$(function() {

    var mandelbrot = new Mandelbrot();

});

var Mandelbrot = function() {
    
    // set some values
    this.width = 500;
    this.height = 500;
   
    this.x_center = -1.407566731001088;
    this.y_center = 2.741525895538953e-10;
    
    this.iterations = 250;
    this.escape = 4,
    this.zoom = 10;
    this.count = 0;

    //let's go - create canvas, image data and workers
    this.init();
    //start animation loop
    this.animate();

};
    
Mandelbrot.prototype = {

    init: function() {

        //create main canvas and append it to div
        var container = $("#content");

        this.canvas = document.createElement("canvas");
        this.canvas.width = this.width;
        this.canvas.height = this.height;

        container.append(this.canvas);

        //create imagedata
        this.context = this.canvas.getContext("2d");
        this.image = this.context.getImageData(0, 0, this.width, this.height);
        this.data = new Int32Array(this.image.data.buffer);

    },

    iterate: function() {
        
        var x_step = this.zoom / this.width;
        var y_step = this.zoom / this.height;
       
        for (var y = 0; y < this.height; y++) {

            var iy = this.y_center - this.zoom / 2 + y * y_step;

            for (var x = 0; x < this.width; x++) {

                var rx = this.x_center - this.zoom / 2 + x * x_step;

                var zx = rx;
                var zy = iy;
                var zx2 = 0;
                var zy2 = 0;

                for (var i = 0; zx2 + zy2 < this.escape && i < this.iterations; ++i) {

                    zx2 = zx * zx;
                    zy2 = zy * zy;
                    zy = (zx + zx) * zy + iy;
                    zx = zx2 - zy2 + rx;

                }

                this.data[y * this.width + x] = (255 << 24) | (i << 16) | (i << 8) | i;

            }
        }

        this.context.putImageData(this.image, 0, 0);

    },

    animate:...