CSS Selectors Performance

Please, stop caring about it and let the browsers do their job

I personally consider this blog post the tombstone on the dispute about CSS Selectors performance (and a new nail in the coffin for my adoption of BEM and OOCSS).

For me, it has confirmed my believe that it is absolute folly to worry about the type of selector used. Second guessing a selector engine is pointless as the manner selector engines work through selectors clearly differs. Further more, the difference between fastest and slowest selectors isn’t massive, even on a ludicrous DOM size like this. As we say in the North of England, ‘There are bigger fish to fry’.

And if you don’t believe me, this is what Chris Coyier has to say:


And by the way, another blog post have shown that having one or one thousand media query declarations… well, it doesn’t make that much difference!

Update: some friends of mine stated that in OOCSS the performance in discussion actually is the resulting file size of the CSS. Well, this is is not true. And even assuming that it was that the reason, below you can see the stats about what on average a webpage is made of: the CSS file weights for only 2.8% of the total of the page weight. So please, let’s start to optimize where the actual weight is, ok?


Source: HTTP Archive