Loading image in jQuery promise freezes while browser is busy

Question

I have the following code:

var self = this;
jQuery('#' + loadingAlert.id).promise()
          .done(() => self.showProgress())
          .done(window.setTimeout(() => self.someMethod(), 100));
          .done(() => self.hideProgress());

The someMethod function makes the browser so busy that it freezes the loading gif. Is there any work around for this so that my loading gif moves while the browser is busy (note: cannot click on anything as it is very busy);

Answer 1

In modern browsers, you can use a webworker. – Kevin B

I used webworker to fix this problem, so the heavy parsing is in the background and doesn't freeze the browser as well.

Though it doesn't work in IE9 and other browsers mentioned here, I just made a work around:

if (window['Worker']) { ... }

which means if it supports the webworker. Those that don't support the webworker hangs (still using my old code), but the browser versions which does work perfectly.

Answer 2

Is there any work around for this so that my loading gif moves while the browser is busy

No. You will have to change the someMethod function which causes the freeze to become asynchronous and do its work in smaller chunks.