This is just a question to help me understand CSS rendering better.
Lets say we have a million lines of this.
-
According to the Mozilla Developer Center, the most efficient selector for this case would be simply .third
In fact, they state there, explicitly, "Don't qualify Class Rules with tag names". In general, for greatest efficiency, use the simplest selector that matches. That's why .third
beats span.third
beats .second span.third
, etc.
I can't tell what Gumbo's conclusion is meant to be, but Ólafur appears to be drawing the conclusion from it that using more stuff in the selector makes the CSS parsing more efficient, when, in fact, it's just the opposite (assuming other CSS parsing engines work similarly to Mozilla's.)