Question

I’m looking for information regarding what Sizzle (jQuery) does internally when you run a selector against it. Ideally either someone that’s done a write-up/blog post about how different browsers or handled, or a site that can de-compile a selector for various browsers. Specifically, I have a team that is saying code I wrote is locking up IE7 on very large data-sets:

.find('.row:not(.row-0) .col-' + colN + ':not(.forbid-transfer)')

And that changing it to:

.find('.row:not(.row-0) .col-' + colN).filter(':not(.forbid-transfer)')

fixes the speed issue.

To me this is a complete wtf since I’d assume that those two are identical within the engine, but apparently they aren’t. Note that everything within the parent container is a div so changing this to div.row... div.col.... shouldn’t speed up anything.

Answer 1

I bet that

.find('.row:not(.row-0)').find('.col-' + colN).filter(':not(.forbid-transfer)')

would be even faster in IE7, perhaps not in a browser that supports “querySelectorAll()”. Even with that, it depends on the particulars of the page.