Сокращение количества DOM-элементов
Чем больше байт информации необходимо загрузить, тем сложнее считается страница и тем медленнее доступ к DOM-элементам из JavaScript. Есть принципиальная разница, обрабатываете ли Вы 500 или 5000 DOM-эементов на странице, например, когда хотите добавить обработчик событий.
Большое количество DOM-элементов может быть признаком того, что что-то должно быть улучшено на этой странице без потери контента. Используете ли вы вложенные таблицы для вёрстки? Вы добавляете дополнительные <div> только с целью исправления проблем вёрстки? Возможно, есть более лучший, и более семантически корректный способ сделать разметку.
Утилиты YUI CSS utilities оказывают большую помощь в вёрстке:
grids.css может помочь вам с общей вёрсткой, fonts.css и reset.css
могут помочь переопределить параметры форматирования по умолчанию в браузере. Это возможность начать заново и подумать о разметке, например, использовать <div> только, если есть семантический смысл, а не, потому что тег <div> создаёт новую строку.
Количество DOM-элементов легко проверить. просто введите в консоли Firebug:
document.getElementsByTagName('*').length
Какое количество DOM-элементов считается достаточным? Проверьте другие аналогичные страницы, которые имеют хорошую разметку. Например, домашняя страница Yahoo! достаточно заполненная страница и имеет менее 700 элементов (html-тэгов).
Оригинал статьи на developer.yahoo.com
Перевод КОМТЕТ komtet.ru