Результаты

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

Сравнивать абсолютные значения в рамках данного эксперимента не представляется возможным, ибо каждому браузеру дополнительно нужно было расположить на странице несколько тысяч «плавающих» блоков с заданными размерами (float:left; width:20px; height:20px, фон для которых и задавался). Эта задача не имеет ничего общего со скоростью работы CSS-селекторов, но может отнимать существенное время у браузера на подготовку изображения страницы на экране (как видно, например, для Opera).

Firefox 2 Opera 9.5 Safari 3 IE 7 IE 6 IE 5.5
 
p.class 308 5887 237 82 72 145
.class 219 6456 225 78 70 149
 
p#id 349 7377 338 91 87 156
#id 214 7427 220 83 84 159
 
div>p.class 519 9412 247 97 84 158
div>.class 836 12886 257 95 81 159
 
div>p#id 549 10299 247 105 92 172
div>#id 858 15172 242 113 91 169
 
div p.class 827 10706 256 97 84 161
div .class 505 15864 247 95 86 160
 
div p#id 772 11952 247 108 99 177
div #id 948 13306 255 108 95 173
 
div.div p.class 1001 10519 263 111 94 165
div.div .class 1099 18742 253 105 92 166
 
div.div p#id 1161 10989 266 117 95 181
div.div #id 1247 15816 256

114 100 187

Таблица 6.1. Для каждого селектора приведено время, затраченное браузером на отображение тестового случая с этим селектором в миллисекундах