Firefox goes to not responding state when a huge javascript is executing -

i have gwt application, on running in firefox, makes go not responding state often.

i tried making dom.max_script_run_time , dom.max_chrome_script_run time 0 in about:config page, allow firefox run javascript forever. browser goes not responding state.

is there workaround this?

if job you're doing big single script run without locking browser, you'll need break job somehow. without details on job you're doing can provide general ideas.

the first option, teemu describes, web workers, great because use separate thread execution can speed page. unfortunately web workers designed data processing, not data display, don't have dom access, if thing you're trying writing lot of dom objects might not right solution. it's relatively new technology browser support can issue.

a lower tech solution i've used in past iterator class, pass big array , function process, , uses settimeout break execution chunks without overloading browser. sample code below:

var iterator = function( items, callback, complete ) {     this.items = items;     this.itemcount = this.items.length;     this.currentitem = 0;     this.callback = callback;     this.completefunction = complete || function(){};     this.interval = 50;     this.started = false;     this.ajax = false;      this.start = function()     {         if( this.started ) return false;          var _this = this;         if( this.itemcount < 1 )         {             this.complete();         }         else         {             this.started = true;             this.timeout = settimeout( function(){ _this.progress(); }, _this.interval );         }     };      this.additem = function( item )     {         this.items.push( item );         this.itemcount = this.items.length;     }      this.clearitems = function()     {         this.items = [];         this.itemcount = 0;         this.currentitem = 0;         this.started = false;     }      this.progress = function()     {         this.currentitem++;          var item = this.items[ this.currentitem - 1 ];          if( ! this.ajax )         {             this.callback( item, this.currentitem, this.itemcount );             this.next();         }         else         {             this.callback( item, );         }     };      this.next = function()     {         var _this = this;          if( this.currentitem >= this.itemcount )         {             this.complete();         }         else         {             this.timeout = settimeout( function(){ _this.progress(); }, this.interval );         }     }      this.complete = function()     {         this.completefunction();         this.clearitems();     }; }; 

usage:

var = new iterator(      // items process     [1,2,3,4,5],      // processing function     function( item, currentitem, totalitems ){         // process item         // write item dom         // perhaps show progress bar?     },      // complete function     function(){         // display completed message         // perhaps hide progress bar?     } ); it.start();