specific implementations of css selector engines
It is wide known that overusing id css ru开发者_Go百科les considered to be a bad practice. There are bunch of posts written on this topic - here is one of the latest, for example.
In such posts it is often mentioned that css selectors are actually parsed by browser engines from right to left. That is, if we, say, have selector #very div then, browser first find all divs, then test them for having parent with this very id.
My question consists of two related parts. First part - is it really true? There are lot of implementations of css engines, both opensourced and proprietary, it would be nice if somebody who knows something about any of these engines, shed the light on this topic.
Second part of question is - if it true, if we really always parsing css rules from right to left, why we actually doing so? I am not a parsing expert at all, but wouldn't it be more handy to define which part of selector is more specific (generates lesser output) and to start filtering not necessarily from right? Is it too pricey or something?
Seteve Sounders did some tests a while ago and while his test confirm this (at least for tested browsers) it also shows the scale of performance gains. For 6000 dom elements the maximum performance boost using classes vs descendant was 200ms (quite significant) with average being way smaller (and way less significant).
This test also shows that while there are differences between browsers and engines (interestingly ie performance best) the trend is the same.
精彩评论