JSFiddle - React, Tailwind, and code Playground

HTML

<canvas id="map" width="100" height="100" style="border: 1px solid red">My Canvas</canvas>

JavaScript

$(document).ready(function () {
    //Log time in two ways
    var startTime = new Date().getTime();
    console.time("Map generated in: ");

    var canvas = $("#map")[0];
    var ctx = canvas.getContext("2d");
    var id = ctx.createImageData(canvas.width, canvas.height);

    var noiseMap = new PerlinNoise(500);

    var startx = 0;
    var starty = 0;

    var value = 0;

    for (var i = startx; i < canvas.width; i++) {
        for (var j = starty; j < canvas.height; j++) {
            value = noiseMap.noise(i, j, 0, 42);
            value = linear(value, -1, 1, 0, 255);
            setPixel(id, i, j, 0, 0, 0, value);
        }
    }

    ctx.putImageData(id, 0, 0);

    var endTime = new Date().getTime();
    console.timeEnd("Map generated in: ");
    alert("Map generated in: " + (endTime - startTime) + "milliseconds");

});

function setPixel(imageData, x, y, r, g, b, a) {
    index = (x + y * imageData.width) * 4;
    imageData.data[index + 0] = r;
    imageData.data[index + 1] = g;
    imageData.data[index + 2] = b;
    imageData.data[index + 3] = a;
}

//This is a port of Ken Perlin's "Improved Noise"
//http://mrl.nyu.edu/~perlin/noise/

//Originally from http://therandomuniverse.blogspot.com/2007/01/perlin-noise-your-new-best-friend.html
//but the site appears to be down, so here is a mirror of it

//Converted from php to javascript by Christian Moe
//Patched the errors with code from here: http://asserttrue.blogspot.fi/2011/12/perlin-noise-in-javascript_31.html

var PerlinNoise = function (seed) {
    this._default_size = 64;
    this.seed = seed;

    //Initialize the permutation array.
    this.p = new Array(512);

    this.permutation = [151, 160, 137, 91, 90, 15,
    131, 13, 201, 95, 96, 53, 194, 233, 7, 225, 140, 36, 103, 30, 69, 142, 8, 99, 37, 240, 21, 10, 23,
    190, 6, 148, 247, 120, 234, 75, 0, 26, 197, 62, 94, 252, 219, 203, 117, 35, 11, 32, 57, 177, 33,
    88, 237, 149, 56, 87, 174, 20, 125, 136, 171, 168, 68, 175, 74, 165, 71, 134,...