class или id? Полезно для разработчиков.

[bork75]

Из статьи:

Создание документа с class обходится меньшей кровью, чем с id (в общем случае, от 2 до 10% выигрыша). Если принять во внимание, что element.class-селекторы отрабатывают быстрее, чем #id на те же 10%, то общий выигрыш при использовании в документе классов перед идентификаторами составит порядка 15%. В абсолютном значении эти цифры не так велики: для Centrino Duo 1.7 получается цифра примерно в 0,0085мс на 1 идентификатор (в среднем, 3 CSS-правила и 1 употребление).

Для документа со 100 элементами выигрыш может составить почти 1мс, для документа с 1000 — 8,5мс! Замечу, что средняя страница в интернете имеет 500–1000 элементов (проверить, сколько элементов на странице, можно просто запустив javascript:alert(document.getElementsByTagName('*').length) в адресной строке браузера на какой-либо открытой странице), поэтому это уже то, за что можно побороться.

Полный текст статьи:

Для просмотра скрытого содержимого вы должны войти или зарегистрироваться.

 

[UDAV]

Данные трех летней давности, так что сейчас, с современными технологиями (подпиленные браузеры и мощные сервера), это не актуально. ИМХО.
Да и что такое 8,5мс? Это же меньше мгновения.

 

[porsche2]

Для увлекающихся оптимизацией всего, что под руку попадется, мгновения очень важны на webo.in даже фавикон оптимизировали (сжимали), несмотря на то, что он обычно кэшируется по максимуму.

Оптимизация - это всегда хорошо, если при полной автоматизации и без фанатизма. Клиентская оптимизация мало относится к мощным серверам, а допиленные браузеры - это бабушка надвое сказала, для браузера важно только правильно понимать и обрабатывать HTTP заголовки, сейчас же браузеры кэшируют все что видят, а это не всегда нужно и ВМ вынуждены делать костыли (например с JS, Ajax), только для новых браузеров - это новые костыли

Если есть вариант с выигрышем в 8,5 мс, его и нужно использовать, т.к. это может компенсировать проигрыш в чем-нибудь другом, на что повлиять нет возможности, например в скорости подгрузки рекламных кодов и их обработке.

P.S. Информация хоть и старая, но актуальная

 

[troop3r]

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

гораздо больше времени займет подгрузка одной картинки, нежели задрачивание селекторов. Картинка может грузится очень долго, так что лучше сосредоточьтесь на оптимизации графики, нежели чтении бесполезных статей.

 

[zzzkabanzzz]

Полмилисикунды дела не решат! И вообще при верстке id и class играют совершенно разную роль, так что выбирайте, то что вам надо!

 

[mcdir]

...Firefox2, IE6, IE7, Opera 9.5 ... против Firefox, IE9 (10), Opera 11 и т.д. + сравнивать кроссовки с ботинками это сильно


короче 1 не актуально + ни какого прироста + будет доп проблемы при кодинге js которая съест весь мииииизерный выйгришь даже если он будет

 

[stogov]

А всё так, потому что:


Id
1. Элемент может иметь только один id.
2. Определённый id может присутствовать на странице только один раз.

Class
1.Можно применять один и тот класс к разным элементам.
2.Элемент может иметь несколько классов.

 

[Miraage]

вы параноики. еще сделайте оптимизацию, уменьшив названия классов и идентификаторов.

лучше вот чем займитесь:
-иконки для соц.сетей(и т.п.) склеивайте в спрайты и юзайте map/area
-склеивание js/css (библиотека Minify, см. кодегуглком)
-тег script(если он у вас один - жму руку) суейте перед </body>
-не сжимайте картинки средствами html(т.е. если у картинки размеры 200x100, а вы в теге img сжимаете в 150x75), это замедляет загрузку страницы.

вот это даст видимую скорость при загрузке страницы

 

[stogov]

Кстати, автору вопроса будет любознательно это прочитать!!!

Для просмотра скрытого содержимого вы должны войти или зарегистрироваться.

Полностью раскрывается разница между ID и Классом

 

[rombikr]

Вынести все картинки, js, css на другой сервер и все проблем не будет. Как бы разделить, php исполняемые скрипты на одном серваке, а все стольное (картинки, js, css и прочая подгружаемая хрень) на другом. Так мы уменьшаем количество обращений к основному серверу и снижаем нагрузку.