HTML/CSSBeginner#css#selectors#performance

What is the universal selector (*) and what are its performance implications?

The * selector matches every element on the page. It's convenient for resets (box-sizing) but can be slower than targeted selectors on very large DOM trees since the browser must evaluate it against every node; use judiciously, mainly for resets.

Example
*, *::before, *::after {
  box-sizing: border-box;
}

Related Questions

1
HTML/CSSIntermediate#css#forms

How do you style form validation states using CSS pseudo-classes?

Open
2
HTML/CSSAdvanced#css#design-systems

What is the difference between rem-based spacing scale and arbitrary pixel values in design systems?

Open
3
HTML/CSSAdvanced#css#performance

How does the 'will-change' property affect rendering performance?

Open