.promise.done improves processing runtime



I have some code that can take up to 50 seconds to run, it's parsing approx 1mb XML files making updates to specific numbers based on a couple of objects.


To provide more helpful user feedback I was looking to update my waiting logo to something with a numerical reference, like 2%, 4%, 6% etc.. I identified the time consuming part as a .each() loop on the $xml.



parseX = $.parseXML(fullXML);
var $xml = $(parseX);
$xml.find("qgroup").each(function () {
//time consuming part
});


I ran a quick size check on the qgroup call wasn't able to get the number updating dynamically despite console.log showing 5/10/15% updates. So based on previous luck threw my update code into a fadeIn().promise.done().


When I ran the code, it now takes < 1 second. Exact timestamps report 58 milliseconds - removing the need for something more in-depth than a basic working image. Here is the final code, spinner is my on-screen 'working' logo, I chose to fadeIn something already existing rather than having an extra div that doesn't actually get used.


Could anyone help me understand why this speed increase has occurred? The output files I get from this are identical.



$xml.find("qgroup").each(function () {
$('.spinner').fadeIn(1).promise().done(function () {
//time consuming code
});
});


Many thanks


No comments:

Post a Comment