perlin noise on a webworker

HTML

<title>MDN Example - Embedded worker</title>
<script type="text/js-worker">
  // This script WON'T be parsed by JS engines because its mime-type is text/js-worker.
    function ImprovedNoise(seed) {
    this.p = [512];
    this.shuffle(seed);

}

ImprovedNoise.prototype = {
    shuffle: function () {

        var permutation = [256],
            i, j, tmp;
        for (i = 0; i < 256; i += 1) {
            permutation[i] = i;
        }

        for (i = 0; i < 256; i += 1) {
            j = ((Math.random() * (256 - i)) | 0) + i;
            tmp = permutation[i];
            permutation[i] = permutation[j];
            permutation[j] = tmp;
            this.p[i + 256] = this.p[i] = permutation[i];
        }
    },
    fade: function (t) {
        return t * t * t * (t * (t * 6 - 15) + 10);
    },
    lerp: function (t, a, b) {
        return a + t * (b - a);
    },
    grad: function (hash, x, y, z) {
        var h = (hash & 15) | 0,
            u = h < 8 ? x : y, // INTO 12 GRADIENT DIRECTIONS.
            v = h < 4 ? y : h === 12 || h === 14 ? x : z;
        return ((h & 1) === 0 ? u : -u) + ((h & 2) === 0 ? v : -v);
    },
    noise: function (x, y, z) {

        var X = (x | 0 & 255) | 0,
            Y = (y | 0 & 255) | 0,
            Z = (z | 0 & 255) | 0;
        x -= x | 0; // FIND RELATIVE X,Y,Z
        y -= y | 0; // OF POINT IN CUBE.
        z -= z | 0;
        var u = this.fade(x),
            A = this.p[X] + Y,
            AA = this.p[A] + Z,
            AB = this.p[A + 1] + Z,
            B = this.p[X + 1] + Y,
            BA = this.p[B] + Z,
            BB = this.p[B + 1] + Z,
            v = this.fade(y),
            w = this.fade(z);



        A = A | 0; //garantir int

        B = B | 0; //garantir int

        return ((this.lerp(w, this.lerp(v, this.lerp(u, this.grad(this.p[AA], x, y, z), // AND ADD
                    this.grad(this.p[BA], x - 1, y, z)), // BLENDED
                this.lerp(u, this.grad(this.p[AB], x, y - 1, z), // RESULTS
    ...

JavaScript

// This script WILL be parsed by JS engines because its mime-type is text/javascript.
  function pageLog (sMsg) {
      var d = document.createElement('div');
     document.body.appendChild(d);
      d.innerText = sMsg;
    // Use a fragment: browser will only render/reflow once.
    //var oFragm = document.createDocumentFragment();
    //oFragm.appendChild(document.createTextNode(sMsg));
    //oFragm.appendChild(document.createElement("br"));
    //document.querySelector("#logDisplay").appendChild(oFragm);
  }
  // This script WILL be parsed by JS engines because its mime-type is text/javascript.

  // In the past...:
  // blob builder existed
  // ...but now we use Blob...:
  var blob = new Blob(Array.prototype.map.call(document.querySelectorAll("script[type=\"text\/js-worker\"]"), function (oScript) { return oScript.textContent; }),{type: "text/javascript"});

  // Creating a new document.worker property containing all our "text/js-worker" scripts.
  document.worker = new Worker(window.URL.createObjectURL(blob));

  document.worker.onmessage = function (oEvent) {
      var recdata = oEvent.data.split(',');
    //pageLog("Received: " + recdata[0]);
      for (var i = 0;i<recdata.length;i++){
          data[i*4] = recdata[i];
          data[i*4+1] = recdata[i];
          data[i*4+2] = recdata[i];
          data[i*4+3] = 255;
      }
      ctx.putImageData(imgdata, 0, 0);
      doit();
  };


  // Start the worker.
//  window.onload = function() { document.worker.postMessage(JSON.stringify(action)); };
/*

var t1 = 0;
var count =0;
var r,v ,g,b ;
var x1 = 0;
var y1 = 0;
window.setInterval(function () {

    count =0;
    
    for (x1 = 1; x1 <= canvas.width; x1+=1) {
        for (y1 = 1; y1 <= canvas.height; y1+=1) {
            v =((n.noise(x1/15, y1/15,t1/60)))*255;
            r = v|0;           
            g = ((n2.noise(x1/15, y1/15,t1/60)))*255;
            b =((n3.noise(x1/15, y1/15,t1/60)))*255;
            data[count] =r;
            data[count+1]...