Потомки селекторы или конкретные классы?

Question

Предположим, у меня есть эта разметка:

<div id="#titles">
<p>Intro text <span>text text</span> text text</p>
<ul>
<li>text text text</li>
<li>text <span>other text</span> text text more text</li>
<li>text text text</li>
</ul>
</div>

и я хочу стилизовать span, который находится внутри li. Лучше использовать селектор потомков #titles li span или добавить пользовательский класс в span, над которым я хочу работать? Я предпочитаю использовать селекторы в таблице стилей, чтобы избежать лишних атрибутов в разметке, чтобы сохранить их как можно более чистыми, но мне было интересно, могут ли быть проблемы с производительностью при использовании большого количества этих селекторов на странице, учитывая, что они могут даже быть глубоко вложенным.

Answer 1

#title li span должно быть отлично. Я не думаю, что использование класса окажет заметное влияние на производительность.

Answer 2

Селектор потомков является более общим, поэтому, если вы хотите стилизовать каждый <span> внутри <li>, используйте его. Если вы хотите стилизовать только некоторые элементы <span>, примените к ним класс. Других отличий нет.