HTML DOM Operation Performance
The table below shows the performance of DOM operations on three major browsers (the percetage is calculated relative to a base operation on that browser,See reference A Study of Ajax Performance for details):
IE7 FireFox Safari HTML DOM Operation Time(us) % Time(us) % Time(us) % Change text using innerHTML 469.0 9979% 234.0 6000% 109.0 7032% Create a text node on HTML Dom 1093.0 23255% 156.0 4000% 110.0 7097% Change the class name of an element 422.0 8979% 47.0 1205% 109.0 7032% getElementById 86.8 1846% 15.7 401% 3.9 252% getElementsByTagName("div") 153.1 3257% 18.0 462% 5.5 352% getElementsByName 93.8 1995% 44.6 1142% 4.7 303% placeDiv.getAttribute("id") 29.7 632% 46.8 1200% 5.5 352% placeDiv.attributes["id"] 31.3 665% 225.0 5769% 6.3 403%
Background material that request this feature
Sam Lie Comments
Poor DOM Perfomance or just poor set of DOM node access API? For example, as yet we don't have a function to search for specific child nodes from the offset of a certain parent node. ie We have document.getElementByID but not div.getElementByID; also xPath available for document only but not for div. Without these more direct access/search for node often we end up having to slowly loop through the whole DOM just to get a specific DOM element inside a given DIV.
Brad Neuberg's comments
BTW, DOM performance is the number one bottleneck (after network latency) for slow Ajax applications. Ever tried to create a giant table that allows dynamic sorting? Just trying to blit the rows of the table to the screen can get slow very fast, resulting in many exotic (fun?) hacks to create such a thing.
Phase I Voting - Vote for Your Top 5 Features
NOTE: PHASE I VOTING IS NOW OPEN. (2008-04-01) We have now changed the voting procedure. Instead of putting votes on each separate wiki page, we are asking people to cast their Phase I Votes on the following wiki page:
Phase II Voting
More about this later.