JSFiddle - React, Tailwind, and code Playground

HTML

<div id="d">start (clicking this will temporarily lock the UI)</div><br>
<div id="s">(Locking UI) Spinner or placeholder showing</div>

CSS

#d{
    cursor:pointer;
    border: 2px inset #ccc;
    display:inline-block;
    padding: 2px;
}
#d:hover{
    background-color: #f5f5f5;
}
#d:active{
    border: 2px outset #ccc;
}

JavaScript

function longRunner(){
 //obfuscated to bypass engine optimization
 function h(val){
  return val;    
 }
 var str = "";
 for( var i = 0; i < 100000000; i++ ){
  str += h(i);
  if( i % 100 ){
   str = "";
  }
 }
}

$("#s").hide();
$("#d").click(function(){
   $("#s").show();
   setTimeout(function(){
    longRunner();
    $("#s").hide();
   },10);
});