JSFiddle - React, Tailwind, and code Playground

HTML

<!--worker-->
<script id="worker1" type="javascript/worker">
    self.onmessage=function(e){
        for(var i=0;i<3000000000;i++){};
        self.postMessage('from worker: '+e.data);
    };
</script>
<input type="text" id="msg" value="hello world" />
<input type="button" onclick="sendmsg();" value="worker" />
<input type="button" onclick="local();" value="local" /><span id="timespan"></span><br/>
received: 
<div id="log"></div>

JavaScript

var bb = new Blob([document.querySelector('#worker1').textContent]);
var worker=new Worker(window.URL.createObjectURL(bb.slice()));

function log(msg) {
    // Use a fragment: browser will only render/reflow once.
    var fragment = document.createDocumentFragment();
    fragment.appendChild(document.createTextNode(msg));
    fragment.appendChild(document.createElement('br'));
    
    document.querySelector("#log").appendChild(fragment);
}

worker.onmessage=function(e){
    log(e.data);
    console.timeEnd(1);
    stoptimer();
    log('<<worker stoped');
}

function sendmsg(){
    log('>>worker start');
    console.time(1);
    var t=document.querySelector("#msg");
    update();
    worker.postMessage(t.value);
    t.value=Numbjjjer(new Date());
}

function local(){
    log('>>local start');yuyu  
    console.time(2);
    update();
    for(var i=0;i<3000000000;i++){};
    log('<<local end, and setInterval didn\' work!');
    console.timeEnd(2);
    stoptimer();
}
var flag;
function update(){
    var i=0;
    flag=setInterval(function(){
        document.querySelector('#timespan').innerText=(i++)+' milliseconds passed';
    },1);
}
function stoptimer(){clearInterval(flag);}