Note that there are some explanatory texts on larger screens.

plurals
  1. PO
    text
    copied!<p><strong>input[name=chkbox]</strong> is coming in as the fastest jQuery selector on my machine under IE7.</p> <pre><code>Unchecking Took 2453ms Checking Took 2438ms Unchecking Took 2438ms Checking Took 2437ms Unchecking Took 2453ms Checking Took 2438ms </code></pre> <p><strong>input.chkbox</strong> and...</p> <pre><code>Unchecking Took 2813ms Checking Took 2797ms Unchecking Took 2797ms Checking Took 2797ms Unchecking Took 2813ms Checking Took 2797ms </code></pre> <p><strong>input:checkbox.chkbox</strong> seem tied</p> <pre><code>Unchecking Took 2797ms Checking Took 2797ms Unchecking Took 2813ms Checking Took 2781ms </code></pre> <p><strong>.chkbox</strong> almost takes twice as long as the input.chkbox</p> <pre><code>Unchecking Took 4031ms Checking Took 4062ms Unchecking Took 4031ms Checking Took 4062ms </code></pre> <p>The javascript for loop is by far the worst coming in at:</p> <pre><code>Checking Took 149797ms </code></pre> <p>150 seconds! It locks the browser too. This just makes me really impressed with jQuery. I honestly didn't expect it to be that slow. Probably because I'm passing across each individual element which it's then having to find...</p> <p>This was pretty interesting to me as well:</p> <p><strong>input[id^='chkbox']</strong></p> <pre><code>Unchecking Took 3031ms Checking Took 3016ms </code></pre> <p>took <strong>less</strong> time than:</p> <p><strong>input[id^='chkbox'][type='checkbox']</strong></p> <pre><code>Unchecking Took 3375ms Checking Took 3344ms </code></pre> <p>I thought since I posted more filters it'd be faster. Nope!</p> <p>Specifying even more paths to the checkbox makes it way slower:</p> <p><strong>#myTable tr[id^='row'] input[id^='chkbox'][type='checkbox']</strong></p> <pre><code>Checking Took 10422ms </code></pre> <p>It didn't even run the second uncheck as it asked me if I wanted to continue running scripts on my computer. Crazy! :P</p> <p><strong>Update Morning 4/14:</strong></p> <p>Someone brought up setting the context: I actually did a few of those and much to my suprise and against what a lot of people have said on the web <strong>on IE7 these were slower</strong>! Here are the times I got with a few different context's specified paired with the quicker selector's above:</p> <p><strong>"input.chkbox", "tr"</strong></p> <pre><code>Checking Took 8546ms </code></pre> <p><strong>"input.chkbox", "tr.myRow"</strong></p> <pre><code>Checking Took 8875ms </code></pre> <p><strong>"input.chkbox", "#form1"</strong></p> <pre><code>Unchecking Took 3032ms Checking Took 3000ms </code></pre> <p><strong>"input.chkbox", "#myTable"</strong></p> <pre><code>Unchecking Took 2906ms Checking Took 2875ms </code></pre> <p>Current winner (still): <strong>input[name=chkbox]</strong></p> <pre><code>Unchecking Took 2469ms Checking Took 2453ms </code></pre> <p><strong>"input[name=chkbox]", "tr.myRow"</strong></p> <pre><code>Checking Took 9547ms </code></pre> <p><strong>"input[name=chkbox]", "#form1"</strong></p> <pre><code>Unchecking Took 3140ms Checking Took 3141ms </code></pre> <p><strong>"input[name=chkbox]", "#myTable"</strong></p> <pre><code>Unchecking Took 2985ms Checking Took 2969ms </code></pre> <p><strong>Update 2 Morning 4/14</strong></p> <p>Thought I might have had a better one after I noticed a syntax difference from <a href="http://beardscratchers.com/journal/jquery-its-all-about-context" rel="nofollow noreferrer">http://beardscratchers.com/journal/jquery-its-all-about-context</a>. It seems that these are NOT the same as <strong>they are giving slightly better times, but still doesn't beat the non-contexted selector</strong> - darn.</p> <p><strong>"input[name=chkbox]", $("#form1")</strong></p> <pre><code>Unchecking Took 3078ms Checking Took 3000ms Unchecking Took 3078ms Checking Took 3016ms </code></pre> <p><strong>"input[name=chkbox]", $("#myTable")</strong></p> <pre><code>Unchecking Took 2938ms Checking Took 2906ms Unchecking Took 2938ms Checking Took 2921ms </code></pre> <p><strong>Update 3 Morning 4/14</strong></p> <p>Russ wanted me to try these out, they de/select ALL the boxes but again it was interesting:</p> <p><strong>:checkbox</strong></p> <pre><code>Unchecking Took 8328ms Checking Took 6250ms </code></pre> <p><strong>input:checkbox</strong></p> <pre><code>Unchecking Took 5016ms Checking Took 5000ms </code></pre> <p>-> Fastest?!?! <strong>input[type=checkbox]</strong></p> <pre><code>Unchecking Took 4969ms Checking Took 4938ms </code></pre> <p>The fact that the third up there is the fastest is quite interesting as that goes against what I would have thought. Why wouldn't (for IE7 at least) the :checkbox just use the type=checkbox to achieve a faster time? These are really close scores but the checking took 62ms less time. Also, why are the first two different at all? Is there a different element besides an input that can take have a checkbox?</p>
 

Querying!

 
Guidance

SQuiL has stopped working due to an internal error.

If you are curious you may find further information in the browser console, which is accessible through the devtools (F12).

Reload