div.div #id

Результаты

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

Сравнивать абсолютные значения в рамках данного эксперимента не представляется возможным, ибо каждому браузеру дополнительно нужно было расположить на странице несколько тысяч «плавающих» блоков с заданными размерами (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. Для каждого селектора приведено время, затраченное браузером на отображение тестового случая с этим селектором в миллисекундах

Поделитесь на страничке

Следующая глава >