Какой переключатель работает быстрее: input[type='text'] или [type='text']?Какой селектор CSS работает быстрее?
В jQuery второй, но в CSS?
Я думаю, что все еще [type='sth'], потому что «менее конкретный и более короткий для чтения» браузером.
CSS performance check Это зависит от браузера.
Оба быстрее, разница в том, что [type='sth'] будет применяться ко всем элементам, включая теги, не входящие в систему.
<link type="sth">
Этот тег будет применяться к вашему классу.
Оба быстрее, чем что? Я понимаю, что OP спрашивает, какой из двух примеров является более быстрым. – enhzflep
Оба они имеют одинаковую скорость. Если ему нужно быстрее загружать файлы CSS, он может свести к минимуму их, но браузер отображает ту же скорость, что и оба примера, которые задают OP. –
, то вы можете отредактировать свой ответ таким образом, чтобы он не включал заявление, которое я запросил. Вопрос не спрашивает о скорости рендеринга. Он спрашивает о скорости селектора. Селекторы используются не только для стилизации элементов, но и для подготовки к показу. ;) – enhzflep
Этот вопрос бессмыслен - ответ должен будет включать определенную версию конкретного браузера, конкретный HTML-файл, конкретный файл css, определенный Javascript и точный сценарий. Кроме того, вам нужно будет определить «быстрее»: быстрее разобрать? быстрее запрашивать из документа? быстрее угадать, соответствует ли конкретный тег правилу?
Несколько лет назад, когда браузеры были просты, это имело некоторый смысл. Современные браузеры имеют оптимизации, которые могут соперничать с современными базами данных или компиляторов, и это делает microbenchmarking спорным. Там может быть любое количество быстрых путей, исключений, угловых случаев, ярлыков для обычных случаев, которые делают такие простые рассуждения невозможными.
Хороший текст, но это не ответы, это комментарий. –
Я голосовал, чтобы закрыть вопрос в любом случае ... и мой наряд не вписывался в комментарии :-) – fdreger
В CSS, нет никакого способа, чтобы определить, какой из них быстрее, но вы можете узнать, какое CSS свойство значения наиболее релевантные для элемента: https://developer.mozilla.org/en-US/docs/Web/CSS/Specificity
Разговор о микро оптимизации ... – naththedeveloper
Можно ли измерить разницу? На каком документе - сколько элементов ему нужно (совпадение и/или несоответствие) сделать измеримую разницу? Я полагаю, можно предположить, что включение типа элемента и атрибута дает больше специфичности (конечно, в DOM легче проверить тип элемента, но использует ли механизм CSS DOM?). Как @ ɴᴀᴛʜ говорит: если вы не можете измерить разницу в реалистичных документах, сосредоточьтесь на ясности вашего кода. – Richard
Мой вопрос был только теоретическим ... :) Я знаю, что современные браузеры быстро интерпретируют CSS, и нет никакого повышения производительности между вводом [type = 'text'] и type ['text']. Я читал эту статью: [link] (https://css-tricks.com/efficiently-rendering-css/). Вкратце, он сказал, что страница становится быстрее, если селектора менее конкретны (конечно, зависит от их вида). Итак, я хотел бы знать, какой селектор работает быстрее, потому что input [type = 'text'] более определен, чем второй. – user3803100