Question

I am wondering how I can solve a hanging page with JS.

I have a JS loop which I’m testing like this, but it seems to hang forever – is there a way to stop it hanging while still completing the script ?:

<div id="my_data"></div>

<script>
function test(value){
output= [];
do{ 
    value++;
    output.push(value);
    document.getElementById('my_data').innerHTML = (output.join(''));
}while(value < 10000000);
alert('end'); // never occurs
}

test(0);
</script>

Answer 1

You are concatenating 10,000,000 consecutive numbers together into a string, which really will not work well on any modern supercomputer.

If you’d like to poll the progress, setup a timer to do it somewhat slower. It isn’t practical, but it looks nice: http://jsfiddle.net/V6jjT/2/

HTML:

<div id="my_data"></div>

Script:

var value = 0;
var interval = setInterval(function() {
    if (value > 100) {
        clearInterval(interval);
        return;
    }

    value++;
    document.getElementById('my_data').innerHTML += ' ' + value;
}, 10);