Не все теги одинаково полезны

Filed Under (css, html, Статьи) by Александр Бойченко on 16-05-2010

Решил померять как быстро отрисовываются теги без применения к ним каких-либо стилей.

Суть теста — генерируем 10к тегов на одной странице и меряем reflow.

Результаты оказались очень любопытные.

Пока даю весьма скромную таблицу, с малым набором тегов.

Тег Safari 4.0.5 (mac) FF 3.6.3 (mac) Opera 10.53 (mac) iPad
div 173 270 218 710
span 52 608 113 294
p 173 287 235 711
b 50 607 116 299
i 50 600 1164 297

Очень странные результаты показал IE — почти нулевые рефлоу (поэтому пока не заполняю таблицу с результатами IE*)

Вывод:

  • в Opera и Safari inline элементы в 2 раза быстрее блочных
  • в FF все наоборот, блочные быстрее инлайновых в 2 раза
  • существую теги, которые серьезно влияют на рефлоу (например i в Опере и FF )

Скоро проведу более детальное исследование + проверим скорость основных css свойств.

upd. имена тегов в таблице ведут на соответствующие тесты

Comments:

5 Комментариев на “Не все теги одинаково полезны”


  1. А как замерить reflow?


  2. подключить файл http://static.yandex.net/reflowmeter/_reflow-meter.js
    а вдресе документа добавить ?reflow-meter
    пример:
    http://vitaly.harisov.name/example/perf-test-classes1.html?reflow-meter


  3. ТО, что дивы в фф быстрее давно сам заметил,


  4. div — 201
    span — 126
    p — 157
    b — 111
    i — 153
    Browser: Chromium 7.0.529.0 (59908)
    на винде 7)
    но правда у мня еще куча расширений стоит которые влияют на загрузку страницы.


  5. Opera 11 — 137, 71, 164, 76 и 80 соответственно. А не пробовали обнулять стили? Тот же i может тормозит из-за выхода текста за пределы элемента.

Оставить комментарий