Unresponsive Javascript checking lots of elements [duplicate]

Question

I created a brute-force like script which basically needs to check more than 27,000 options, and after each check displays the result inside a div.

The script is coded correctly and if I lower the number of options it works sufficiently well, but if I have many options, after a few seconds, a window pops up telling me that my script is unresponsive. How can I make it responsive while checking this many options.

Oh and I almost forgot, it displays data (which is displayed after every check) only when that pop-up window appears (kinda weird).

Answer 1

Asynchronous batch processing may solve your problem:

var options = ...; // your code

// I assume you are using something like this
function processAll() {
  for(var i=0; i<options.length; ++i) ... // causes unresponsivity
}

// try to use this instead
function batchProcessing(from) {
  if(from >= options.length) return;
  var to = Math.min(1000, options.length-from);
  for(var i=from; i<from+to; ++i) ... // your code
  // run the next batch asynchronously, let the browser catch the breath
  setTimeout(batchProcessing.bind(null, from+1000));
}