Comments 27
Если кто то и тут напишет: "Спасибо, очень полезная статья" (с) — буду очень сильно ржать.
:) была ведь статья про спам в комментариях недавно.
Тут исследование для продвинутых разработчиков, для них и полезное. А для горе-верстальщиков, которым что div'ами наворачивать, что таблицами с распорками все едино, тут, естественно, ничего интересного нет.
Тут исследование для продвинутых разработчиков, для них и полезное. А для горе-верстальщиков, которым что div'ами наворачивать, что таблицами с распорками все едино, тут, естественно, ничего интересного нет.
http://habrahabr.ru/blog/webdev/37922.ht… Дальше еще смешнее.: http://habrahabr.ru/blog/webdev/37922.ht…
Далее выяснялось, насколько в браузерах оптимизирована транзитивность по идентификаторам:
#id1
#id2 #id1
#id3 #id1
#id3 #id2 #id1
совершенно глупый тест. идентификатор должен на странице быть уникален, поэтому такие конструкции никогда неприменимы
вы знаете, есть примеры, когда их нужно применить, например, чтобы переписать правило
нужно будет воспользоваться
как это ни странно
#id1 div
нужно будет воспользоваться
#id1 div#id2
как это ни странно
продемонстрируйте примерчик, когда #id1 div не работает.
обменялись минусами? :) соглашусь, изначально приведенный пример, скорее всего, неверен. Однако, есть такой случай
третье правило переписывает второе, а работает, в целом, быстрее (если смотреть на результаты тестов относительно выборки по классами и идентификаторам для каждого брузера).
Пример здесь
Могу предположить, что выборка по двум-трем идентификаторам в некоторых случаях будет побыстрее, чем по дереву тегов/классов
#test1 .div
.div#test2
#test1 #test2
третье правило переписывает второе, а работает, в целом, быстрее (если смотреть на результаты тестов относительно выборки по классами и идентификаторам для каждого брузера).
Пример здесь
Могу предположить, что выборка по двум-трем идентификаторам в некоторых случаях будет побыстрее, чем по дереву тегов/классов
Допустим у нас есть два дива #container1 и #container2 и див #element1 можно перекидывать в любой из них драг-н-дропом. И в зависимости от того, где находится #element1 надо его подкрасить поразному )
Применимы. Например #id2 #id1 это #about-page #footer против #footer на остальных страницах.
Спасибо за проделаный труд, очень полезная статья.
Зачем в этом случае смотреть на относительные цифры? Сколько страниц нормальный пользователь открывает в секунду? После таблицы с цифрами мне кажется надо сразу написать, что разгонять CSS селекторы абсолютно точно не стоит, т.к. на реальных страницах абсолютный выигрыш будет просто смешным. Особенно в свете того, что способы этого разгона для каждого браузера свои.
За цифры спасибо, но выводы у вас странные.
За цифры спасибо, но выводы у вас странные.
2sunnybear
скажите,п ожалуйста, почему, к примеру, строка
>>div a#id1 1506 10572 341 156 116
имеет 4и выделеных значения?
скажите,п ожалуйста, почему, к примеру, строка
>>div a#id1 1506 10572 341 156 116
имеет 4и выделеных значения?
потому что этот селектор в Opera, Safari и IE отрабатывает быстрее аналогов
тогда почему сдесь выделено жирным:
#id2 #id1 1559 33235 320 169 130
если это самое большое значение...
и что, в данном случае, несет в себе термин "аналог" ?
#id2 #id1 1559 33235 320 169 130
если это самое большое значение...
и что, в данном случае, несет в себе термин "аналог" ?
там, где Вы указали, жирным не выделено.
Выделяется меньшее время для каждого браузера в группе из 4 селекторов. Всего для каждого браузера выделено 4 времени из 16, всего для каждой группы селекторов есть 5 выделенных значений.
Всего выделенных значений: 4 группы Х 5 браузеров = 20
Выделяется меньшее время для каждого браузера в группе из 4 селекторов. Всего для каждого браузера выделено 4 времени из 16, всего для каждой группы селекторов есть 5 выделенных значений.
Всего выделенных значений: 4 группы Х 5 браузеров = 20
ага. понял. весьма благодарен.
далее такой вопрос: скажите, пожалуйста, как именно велся подсчет времени?
далее такой вопрос: скажите, пожалуйста, как именно велся подсчет времени?
об этом подробно написано в первой статье
http://webo.in/articles/habrahabr/19-css…
ставится метка времени до объявления стилей и засчитывается разница после окончания HTML-кода
http://webo.in/articles/habrahabr/19-css…
ставится метка времени до объявления стилей и засчитывается разница после окончания HTML-кода
Как бы не очень корректно ставить в одну линейку stable и beta версии браузеров, ага. Это я намекаю на Firefox 2 и Opera 9.5, которая всё ещё бета. Может тогда стоит подключить ещё Firefox 3-4, Safari 3.1 и IE8 ?
Firefox 2 бета? Вообще браузеры рассматривались исходя из их распространенности. Могу еще сказать, что IE8 сильно тормозил на идентификаторах (почти как Opera).
Если вы вдруг не в курсе, Opera 9.5 - сейчас пока ещё бета. :) А последняя stable версия Opera - 9.26
Было бы неплохо увидеть здесь ещё и результаты теста в stable версии Оперы, хотя бы post factum, просто ради интереса.
Было бы неплохо увидеть здесь ещё и результаты теста в stable версии Оперы, хотя бы post factum, просто ради интереса.
Скорость CSS-селекторов — существенна ли разница в их эффективности?. В 2018 году для браузеров разница в скорости обработки несущественна.
Sign up to leave a comment.
Разгоняем CSS-селекторы. Часть 2: транзитивность