Two web workers asynchronously working

Demonstration that two workers can work at the same time

HTML

<h1>
Two web workers asynchronously working
</h1>
<table>
<tr><th>Worker 1</th><th>Worker 2</th></tr>
<tr id="worker_row"><td></td><td></td></tr>
</table>

CSS

table {
  width: 100%
}
#worker_row td {
  border: 1px solid black;
  font-family: "Courier new";
  vertical-align: top;
  max-height: 60vh;
}
p {
  padding: 0px;
  margin: 0px;
}

JavaScript

function workerFN() {
  msgInfo("Worker started.");
  for(var i=0; i<3; i++) {
    let req = new XMLHttpRequest();
    req.open("POST", "/echo/html/", false);
    req.send("html=test&delay=1");
    msgInfo("Request done "+(i+1)+"/3");
  }
  const maxNum = 10000000*Math.round(Math.random()*100);
  for(var i=0; i<maxNum; i++) {
    if(i%(maxNum/5)==0)
      msgInfo("Calculated "+i+" of "+maxNum+".");
  }
  msgInfo("Worker done.");
  self.onmessage = function(e) {
    switch(e.data.name) {
      case "" : 
      break;
      default:
        console.error("Unknown message:", e.data.name);
    }
  }
  function msgInfo(data) {
    self.postMessage({name:"INFO", msg:data});
  }
}
// This is a trick to generate real worker script that is loaded from server
var url = "/echo/js/?js="+encodeURIComponent("("+workerFN.toString()+")()");
makeWorker(url, $("#worker_row td")[0]);
makeWorker(url, $("#worker_row td")[1]);
function makeWorker(url, output) {
  
  var worker = new Worker(url);
  worker.addEventListener("message", function(e) {
    switch(e.data.name) {
      case "INFO" : 
        var row = document.createElement("p");
        row.innerHTML = e.data.msg;
        output.appendChild(row);
      break;
      default:
        console.error("Unknown message:", e.data.name);
    }
  })
}