Progressbar: Force element.innerHTML update before javascript sort call
        Posted  
        
            by maras
        on Stack Overflow
        
        See other posts from Stack Overflow
        
            or by maras
        
        
        
        Published on 2010-05-08T20:30:12Z
        Indexed on 
            2010/05/08
            20:38 UTC
        
        
        Read the original article
        Hit count: 284
        
JavaScript
|progressbar
Hi, what is the best practice for this scenario: 1) User clicks "Sort huge javascript array" 2) Browser shows "Sorting..." through element.innerHTML="Sorting" 3) Browser sorts huge javascript array (100% CPU for several seconds) while displaying "Sorting..." message. 4) Browser shows result.
Pseudo code:
...
<a href="#" onclick="sortHugeArray();return false">Sort huge array</a>
...
function sortHugeArray(){
  document.getElementById("progress").innerHTML="Sorting...";
  ...do huge sort ...
  ...render result...
  document.getElementById("progress").innerHTML=result;
}
When i do that this way, browser never shows "Sorting...", it freezes browser for several seconds and shows result without noticing user...
Thank you for advice.
© Stack Overflow or respective owner