window.addEventListener("load",async ()=> {
    
  var info = document.createElement("div");
  info.innerHTML="both <br> test A: (new TextEncoder()).encode(str) and <br> test B: new Blob([str])<br> will block the UI thread equally<br><br>"
  info.style.color="blue";
  document.body.appendChild(info);
  var div = document.createElement("div");
  var acount=0;
  var bcount=0;
  var end;
  var secs=10;
  var done=false
  document.body.appendChild(div);
  (function info(){
    div.innerHTML="end in "+(end - Date.now())
          +"<br>acount="+acount
          +"<br>bcount="+bcount; 
    if(!done)
    setTimeout(info,100);
  })();

  function wait(ms=100){
      return new Promise((resolve)=>{
          setTimeout(resolve,ms);
      });
  }

  await (()=>{return new Promise((resolve)=>{console.log('start promise');setTimeout(resolve,100);});})();
  var a = (new Array(20000000)).join(".");
  const enc = new TextEncoder();
  var ab;
   
  console.log("start test a");
  end = Date.now() + secs * 1000; 
  while(Date.now()<end){
      acount++;
      for(let i=0; i<10; i++)
      {
        ab = enc.encode(a);
        await wait(0);
        var first = new Uint8Array(ab)[0];
      }
  }
  console.log("ended test a",acount);
 
  console.log("start test b");
  end = Date.now() + secs * 1000; 
  while(Date.now()<end){
      bcount++;
      for(let i=0; i<10; i++)
      {
        //ab = await new Blob([a]).arrayBuffer();
        new Blob([a]);
      }
  }
  console.log("ended test b",bcount);
  done=true;
},false);