Heavy load js - SP2010 - long time running script - freeze browser

Mar 3, 2014 at 6:31 AM
Edited Mar 3, 2014 at 6:32 AM
Hello,
I have long time running js which freeze browser.
I trying to update all list items from 2 secondary lists (every item from list one could have multiple children items in two secondary lists joined together with custom id of an item). Using jquery and spservices.

Script should run on click and display progress bar. I tried many different ways (async: true,false; setTimout(), setInterval() ...) but I cant get to work any kind of progress bar and browser cant handle any user interaction (freeze) during the script. Have anyone any idea how I could improve the script? (I could post more parts but I try to keep it simple for read)
setInterval(updateUsers(),100)

function updateUsers() {
  jQuery().SPServices({
  operation: 'GetListItems',
  async: true,
  .....
  completefunc: function(xData, Status) {
  jQuery(xData.responseXML).SPFilterNode("z:row").each(function() {
  .....
    jQuery().SPServices({
      operation: 'GetListItems',
      ....
      completefunc: function(xData, Status) {
        jQuery(xData.responseXML).SPFilterNode("z:row").each(function() {
        ....
    });});});
    jQuery().SPServices({
      operation: 'GetListItems',
      ....
      completefunc: function(xData, Status) {
        jQuery(xData.responseXML).SPFilterNode("z:row").each(function() {
        ....
    });});});
    jQuery().SPServices({
      operation: "UpdateListItems",
      listName: 'Odboráři',
      ....
    });
    setTimeout(updateProggress(),0);
  });});});
}

function updateProggress() {
//some cool progressbar
}
Mar 3, 2014 at 10:38 PM
How are you sending your updates to the server (the UpdateListItems)? one at a time? If so, you will want to build up your own XML for UpdateListItems and do the updates in batches (ex. 100 at a time)
See this post where I provided a function that allows you to throttle batch updates once you build up an array of updates: https://spservices.codeplex.com/discussions/440360 . That post also gives you some design tips on how your program should be structure to give you the optimal results.

Note that with very large set of updates, you really can't avoid locking up the UI unless you use Web Workers, which unfortunately is not easy and not supported on older browsers.

/Paul.
Mar 4, 2014 at 5:58 AM
It's updated one by one (and update only when it needed). But update is not main problem. Process itself (crawling users one by one and connected tables is long process) is a problem. I read about web workers but if I read it right it dont allow jQuery so I suppose that spservices + jQuery could be problem too but I dont give it a try.

So my main problem is I want to show some progress bar about operation status for user if I cant handle the browser freeze (he need to know why browser is freezed if i cant handle that freeze) (but if i cant handle freeze, it cant show any progress bar so its "vicious circle").

But thank you for your post it is usefull :-)
Mar 4, 2014 at 5:09 PM
The use of Web Workers is possible, but you need to code it all in core javascript. in a Worker, there is no DOM or DOcument tree, thus jQuery cannot be used.

Re: Showing a message

As long as you understand that everything in the browser is single threaded (javascript, screen painting, etc), then you can display a message, but you will need to use a setTimeout() so that your next piece of javascript only executes a few seconds later...

Example:
showMessageOnTheScreen();
setTimeout(function(){

    // Start doing your updates here... 

}, 1000);
If you want to show other updates as the updates are going on, you will need to use a similar approach. The setTimeout give the browser an opportunity to do "other stuff" - like paint the screen with your message.

Paul.