It's no surprise that the jQuery code is slower: you can always outperform
jQuery with a custom-tuned loop. After all, jQuery has to do everything that
your custom loop does, plus much more. For one thing, jQuery has to first
build an array of all the items and then traverse that array. Your custom
code doesn't have to build an array at all.
You may be able to pick up a tiny bit more speed in your loop. First, make
sure to "var" your "i" variable. If you don't "var" it, "i" is actually a
property of the window object, and if this code is inside a function, that
will make it slower to access the variable.
Also, don't look up myListBox.length every time through the loop; you can
either look it up once at the beginning or not at all.
I would try these three variations on your loop and see if any of them comes
up faster:
for( var i = 0, n = myListBox.length; i < n; )
myListBox[i++].selected = true;
for( var i = myListBox.length; i > 0; )
myListBox[--i].selected = true;
for( var i = -1, option; option = myListBox[++i]; )
option.selected = true;
I'll be curious to know the result.
My guess is that one of those may be a bit faster, but still too slow to be
acceptable. If that's the case, there may be nothing to be done for it
except to do the selecting in batches of, say, 1000 elements with a short
timeout between each batch. That way the browser will remain responsive
while you run the loop.
-Mike
> From: JQueryProgrammer
>
> I have been using jQuery for quite some time now. For one of
> my projects, I needed to select all the options in the
> listbox which were 10,000+. I tried to do a comparison
> between using jQuery and conventional javascript and here are
> my findings:
>
> 1. With jQuery:
> Code: $("#myListBox *").attr("selected","selected");
> Time taken: 70000+ milliseconds
>
> 2. With JavaScript:
> Code: for( i=0; i < myListBox.length; i++) { myListBox
> [i].selected = true; }
> Time taken: 21000+ milliseconds
>
> Can anyone provide with some better code or justify why is
> jQuery taking so much time.
