Разгоняем CSS-селекторы: id против class, раунд второй

[westfild]

Мне приходилось как-то работать над одним проектом, где достаточно остро вставал вопрос о оптимизации кода для снижения нагрузки на систему пользователя, так вот почему-то до такого казалось бы простого метода наши спецы не додумались..
Жалко, что только сейчас об этом методе узнал.
Спасибо за статью.

[not_ice]

бороться за 8мс? увольте)

[westfild]

Когда вопрос о нагрузке на машину стоит остро, то использование этого метода в купе с другими может дать вполне ощутимые результаты.

[westfild]

Минуснул кто-то)
Простите меня великодушно, видимо такую глупость несусветную сморозил. Самому стыдно..

[pvasili]

В куппе с другими(аналогичными) будет 12-15mс. И что? Если бы 5-10 сек - тогда да

[sunnybear]

какими именно "аналогичными"? Речь идет о подходе, а даже не о преимуществах семантической верстке перед табличной

[pvasili]

я поддержал not_ice, хабр глучно не туда вставил....
я не о преимуществах,а о подходе. Если выигрыш на нескольких тысячах ID получается 8мс. То овчинка(даже в купе с другими ухищрениями) абсолютно не стоит выделки. Хотя опыт занятный :)

[sunnybear]

в данной статье приводятся общие рекомендации для создания высокопроизводительных страниц. Если насобирать эти "8мс на тысячах", получается вполне заметное время. А трудности в использовании class вместо ID никакой — только дело привычки

[LFK]

Это знаете, как разогнать процессор на 10 процентов и получить выигрыш в колчисетве 1 FPS в игре — роли не играет. А за статью спасибо, труд познавательный! :)

[sunnybear]

а если таких разгонов будет 10 штук? а если 20? речь, собственно, о том, чтобы все эти разгоны найти и, по возможности, как-то автоматизировать :)

[bmc]

А если бы он вместо макарон патроны вёз?!

[phantasm]

один из побочных выводов исследования - то, что Safari - адски быстрый браузер, а IE - адски медленный (хоть это и не новость). и, кстати, жаль, что нет FF3, а ведь его релиз-кандидат уже совсем скоро

[sunnybear]

он у меня "убил" кеширование в Лисе, пришлось все переставлять. Поэтому я пока к нему с недоверием. Выйдет — опробуем по-нормальному.

И пока еще зреет мысль о создании независимого теста производительности браузеров на основе текущих тестов, будет довольно интересно.

[BaBL]

До первого теста, к сожалению, еще не добрался, но вот то, что ID работает медленнее, чем class для меня стало новостью. Спасибо. Вообще странно, учитывая что для элемента присущ уникальный идентификатор ID и может быть целый набор классов, а сами классы могут объединять сколь угодно много элементов, выборка ID, по идее, должна бы происходить существенно быстрее.

[sunnybear]

в этом-то и загвоздка: браузеры создают хеш этих самых ID, чтобы к ним быстро обращаться, а на создание хеша и проверку его целостности уходят драгоценные ресурсы. Изначально такой вывод не предполагался, однако, результаты говорят сами за себя

[oknechirik]

интересно

[3hrek]

Интересно, но бесполезно. То, что class быстрее, чем id - давно известно (еще где-то на w3c читал)..
Кстати почитайте http://www.artlebedev.ru/tools/technogrette/js/lookup-tables/
действительно хорошая заметка, я этим способом часто пользуюсь.

[sunnybear]

здесь
http://webo.in/articles/habrahabr/23-hig…
написано больше, и не только об этом. Кеш — да, он спасает, но не всегда... Есть, в частности, грабли при кешировании сложных объектов

[denver]

Исследование вкупе с выводами потрясают:

основных советов пока два: уменьшайте DOM-дерево

Не ешьте на ночь сырых помидоров..

используйте id только в случае действительной необходимости.

Избегайте id чтобы для среднего html выиграть 0.0085 секунды на клиентском тазике.
Это что, такая шутка?

[sunnybear]

боюсь, Ваш сарказм здесь не очень уместен

[denver]

А я серьезно. Если статья для тех верстальщиков которые используют кучу id вместо классов, то надо было так и написать (хотя скорее всего js-программер их уже попросил не ставить больше одного id="item" на документ). А то ведь найдутся такие веб-мастерки, которые увидя ваши графики и выводы действительно подумают что id нынче дорог. В итоге, браузеры оптимизируют getElementById, тратят на это 8,5мс, а мы раскусив это будем избегать id, и в конце концов кто-нибудь напишет getElementByClass и будет, не дай бог, еще его юзать.

[sunnybear]

эта статья — для тех, кто думает :)

[Postum]

Для типичных страниц типичных сайтов борьба class VS id неуместна.

Но для специфичиских страниц с данными в таблицах, где реально десятки тысяч элементов и для них требуется динамика - это важно.

[lifestar]

Для контейнеров и оболочек я использую ID, для внутренностей уже class. Дело в том, что я использую jQuery и мне удобнее обращаться к элементам именно по ID

[127]

жжошь,
удивлен что никто не затеял холивора на тему, что id & class для разных целей

[Olegbl4]

Заголовок "Влияние на getElementsById" поменяйте на "Влияние на getElementById"... очепятко!

[vini]

не знал что class быстрее id

[XXXVII]

У меня такой вопрос: я использую id для обозначения узлов дерева, к листьям добираюсь таким способом (утрированно): #id ul li span. Классы я использую только в том случае, когда необходимо один и тот же стиль применить к нескольким элементам.
И я считаю, что поступаю правильно, создавая такую разметку. Я прав?,)

[sunnybear]

в общем случае нет. Если ID не нужен для доступа через JavaScript, то лучше его делать class'ом: так будет эффективнее

[Matrosked]

вы, простите, на спичках экономите)