Как влияет на производительность рендера браузера селектор * в CSS?

Question

[myskypesla]

Работаю над приложением и возник вопрос, сильно ли повлияет на производительность приложения такое свойство?

* {
    box-sizing: border-box;
}

или лучше же таргетно делать только для элементов, которым нужно это свойство?

Answer 1

[Максим Тимофеев]

Если и влияет то так не значительно, что этим можно пренебречь.

Answer 2

[Сергей delphinpro]

Оптимизация css - это последнее что нужно оптимизировать, если страница тормозит. Особенно селекторы. Если уж хотите заниматься оптимизацией производительности в css, то изучите, например, свойство will-change

PS. Всеми любимый бутстрап, и другие фреймворки (например Materialize) используют подобный селектор для border-box и не парятся.

Answer 3

[dom1n1k]

Никак, если не рассматривать искусственно доведенные до абсурда случаи.

Answer 4

[Кирилл]

Если просто выбирать все селекторы, то ничего страшного.
Но, по скольку браузеры читают селекторы справа налево, то всё-таки стоит избегать конструкций со вложенной звёздочкой, на пример
div > *
В таком случае браузер проверяет все элементы на вложенность в div.
Но как сказали другие пользователи - тормозить не должно и при таком подходе.
Ну и что бы полностью разобраться в вопросе советую вам к прочтению небольшую статью frontender.info/writing-efficient-css-selectors