Table of Contents
CSS Selectors
Introduction
One of the hot topics of all well-known low-level libraries is the feature set and performance of the CSS selector engine. These query engines are used to select a set of nodes according to a selector set as known from CSS3.
The W3C has standardized the new methods querySelector and querySelectorAll with the Selectors API. This is already implemented by the latest nightlies of webkit.
We like to include a CSS selector engine in qooxdoo 0.8 as well.
There is a performance test available called Slickspeed which was developed by the Mootools authors. The test uses some of the typical selectors (and some less used ones as well) and finds the best performing implementation across different libraries.
Testing machines
- Windows Vista, Dual Core Pentium D, 2GB Ram
- OS X Leopard, Mac Book 2GHz, 2GB Ram
Results
Tested with the excellent SlickSpeed configuration hosted at DOMAssistant:
- DOMAssistant 2.6
- jQuery 1.2.3
- Prototype 1.6.0.2
- Mootools 1.2b2
- ExtJS Core 2.0.1
- YUI 2.4.1
Windows Vista:
| DOMASS | JQUERY | PROTO | MOO | EXT | YUI | |
|---|---|---|---|---|---|---|
| IE7 | 746 | 914 | 1593 | 1060 | 343 | 941 |
| Firefox 3 | 82 | 281 | 124 | 106 | 190 | 476 |
| Safari 3.1 | 12 | 128 | 87 | 78 | 61 | 305 |
| Opera 9.5 | 91 | 444 | 145 | 194 | 264 | 615 |
OS X Leopard:
| DOMASS | JQUERY | PROTO | MOO | EXT | YUI | |
|---|---|---|---|---|---|---|
| Firefox 3 | 83 | 226 | 126 | 107 | 164 | 387 |
| Safari 3.1 | 24 | 113 | 86 | 86 | 68 | 204 |
| Opera 9.5 | 75 | 231 | 114 | 122 | 126 | 313 |
Summary
Fastest engine for Internet Explorer seems to be ExtJS. Fastest overall engine is DOMAssistant. Leading in the browsers Firefox 3, Safari 3.1 and Opera 9.5.
DOMAssistant uses XPath where possible which means that the XPath engine is quite fast because it wins the race in every tested condition. ExtJS uses node iteration and compiled functions to get optimal results in IE.
