Long-running loops in JavaScript and UI responsiveness

Question

I had a code that processes a huge JSON array in a "for" loop.

for(var i = 0; item = arr[i]; i++) {
   //PROCESS item
}

The issue was with a Firefox browser. It shows a warning dialog that script is running too long. The following code was the solution

//not precise code example, but it's kind of.
delay(arr, 0);

function delay(arr, num) {
   //process array by parts with 50 elements in each part
   for(var i = 1; i <= 50; i++) { 
      //PROCESS arr[num];
      num += i;
   }
   if(num < arr.length) {
      setTimeout(function() { delay(arr, num); }, 100);
   }
}

I wondering if there is a more fabulous way to workaround complete UI freeze and make Firefox to don't show script debug dialog. Please advise. Thanks

Flynn · Accepted Answer · 2014-10-14 12:37:24Z

2

If you are using Firefox, you might be looking for web workers, which allows you to spawn background threads.

answered Oct 14, 2014 at 12:37

Flynn

6,2418 gold badges40 silver badges55 bronze badges

Sign up to request clarification or add additional context in comments.

2 Comments

xwrs Over a year ago

I was hoping that there is some cross-browser solution, because other browsers are getting frozen as well, just without dialog boxes. And the CPU load on user's PC is 100% of course.

Flynn Over a year ago

As best I can tell Web Workers are supported in Chrome, IE10+, Safari, etc. See here: caniuse.com/#feat=webworkers

Sven Schürmann · Accepted Answer · 2014-10-14 12:41:28Z

1

I think web workers are what you need.

Here you can find an good introduction to web workers: link

answered Oct 14, 2014 at 12:41

Sven Schürmann

6123 silver badges4 bronze badges

Collectives™ on Stack Overflow

Long-running loops in JavaScript and UI responsiveness

2 Answers 2

2 Comments

Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

2 Answers 2

2 Comments

Comments

Your Answer

Sign up or log in

Post as a guest

Related