CSS Cascade: Specificity, Inheritance and Style Resolution
Four things every engineer 'knows' about CSS, and what Chromium 154 actually does. Specificity is not a tuple compared column by column — it is one packed 24-bit integer whose class-like byte SATURATES at 255 instead of carrying, so a 256th class changes nothing and a single #id still wins, by a clamp rather than a comparison. !important does not top the origin ladder, it INVERTS it: the low four bits are flipped, so among important declarations the user-agent sheet outranks the user sheet which outranks yours — a user's accessibility override beating you is a bitwise NOT, not a special case. Inline styles are not uncached: Blink matches them with is_cacheable=true and keeps an incremental fast path that exists only for them — what actually destroys it is an author !important beating an inline declaration, at which point every mutation becomes a full recalc and children must re-match rules instead of cloning the inherited group. And a large stylesheet is not inherently slow to match, because a selector entirely covered by bucketing is never evaluated at all; the cost driver is candidates examined per element, so 50,000 flat class selectors stay near-free while 5,000 descendant selectors do not. Change the rule count, selector complexity, importance conflict, inline styling, critical-CSS extraction and dead-rule share, and watch the server-computed cascade — including the one real conjunction, where two settings that are each harmless alone become pathological together. Validated against Chromium 154.0.8037.57 (CSSSelector::Specificity, CascadeOrigin, CanApplyInlineStyleIncrementally, IsEntirelyCoveredByBucketing, HaveRenderBlockingResourcesLoaded).
- All current + future modules
- Full kata library
- Progress dashboard + weak area analysis
Cancel anytime. Billed annually.