0

since css selectors are calculated from right to left, it appears that 

:not(.ignore).select

would be more efficient than

.select:not(.ignore)

because the latter would have to find all the elements that are not .ignore,

while the former would only have to find the elements that match .select and then filter out the results that match .ignore

assume for simplicity that them dom does not contain a disproportionate amount of either the ignore or select class.

CodeToad
  • 4,656
  • 6
  • 41
  • 53
  • Order makes no difference. – Niet the Dark Absol May 03 '16 at 11:49
  • do you mean specifically in this cases order is irrelevant? I assume that in cases such as div.selected versus .selected.div order is relevant. – CodeToad May 03 '16 at 11:50
  • Not sure what you mean by efficient, but they are functionally equivalent. – drz May 03 '16 at 12:02
  • @CodeToad: Type and universal selectors are an exception to the rule - they have to appear first no matter what, because of the way the grammar is designed. This in no way implies that they are the slowest - in fact, type selectors are only slightly less performant than ids and classes, and the universal selector is basically a guaranteed match, the browser doesn't even have to *think*. – BoltClock May 03 '16 at 12:04
  • indeed, I overlooked the fact that type selectors must appear first due to the syntax. Just to clarify, is the order of chained selectors generally irrelevant with regards to efficiency, setting aside unique browser quirks? – CodeToad May 03 '16 at 12:48
  • @CodeToad: Pretty much. – BoltClock May 03 '16 at 13:20
  • You should test with two pages on your website; two pages identical except for this style rule. If you can't notice any difference in performance, the order doesn't matter. – Mr Lister May 03 '16 at 15:57

0 Answers0