Эффективный CSS с дочерними селекторами, стоит ли это того?

Question

Я знаю:

div > p

быстрее сделать, чем

div p

но, с другой стороны, он занимает еще один символ, поэтому увеличивает время отправки файла CSS.

Я знаю, что разница в скорости очень мала, но если у вас очень большой CSS-файл с большим количеством селекторов, он может стать важным.

Итак, мой вопрос: что лучше: потерять некоторое время рендеринга и не использовать дочерние селекторы или дочерние селекторы и потерять еще немного времени при отправке файла CSS?

Answer 1

Div > p а также div p не одинаковы

если у вас есть следующая структура:

<div>
  <p id="p1">first p</p>
  <section>
     <p id="p2">second p</p>
  </section>
</div>

div > p будет применяться только к p1, в то время как div p и к р1 и к р2.

Скорость селекторов будет зависеть от вашей структуры HTML.

Answer 2

Вы должны различать загрузку данных с сервера и анализировать HTML+CSS.

во время загрузки вы правы (будет медленнее)

но при рендере вы ошибаетесь (это будет быстрее)

PS не забывайте: если у вас есть CSS - он не будет загружен снова.