views:

61

answers:

2

Preamble: I like my digital subscription of some computer magazine (no advertisement!), it contains cool weekly digest of programmers useful links. I'm not going to place it there to avoid raising interest. The last issue contained something "30 best practices to your web application performance"

The first rule declares "Limit interaction with DOM as much as possible... Consider setting innerHTML over document.createElement/appendChild()...."

From my point of view - this is rubbish, and I wrote small HTML that proof my point of view (if somebody interesting it is placed there http://codepad.org/XxAH6sLZ )

My proof is true for Opera, Chrome, IE, Firefox browsers and shows performance of DOM 10-50%

I have tried to argue to author about it, but my comment was banned.

At last my question is not about HTML or jscript, so here it is: how to struggle with wittingly false knowledge distributed over Internet, found by Google.

A: 

Just like in other media: write something better and hope people pick up on it. If there was a legal right to get printed in the original magazine, as there is for slander, abuse would abound.

Tobias
+1  A: 

Greetings,

I have experienced speed ups in replacing DOM based code with innerHTML code, especially on Safari. Your example is fairly naive and not representative of the real world, you are not setting id's or classnames or adding event handlers or doing nested divs or anything fancy.

In all fairness, I modified your test code and added some more stuff and DOM remained faster, even on Safari. So I am not really sure where the catch is..

T.

tomdemuyt
I also spend huge amount of time to discover this question. My "naive example" covers rather popular operations performed by 70% of code. Nesting divs add nothing to this. I can agree about event handling, but my question is not about jscript. I'm just wonder that somebody distributes wrong knowledge without any reservation and notion in style "but if you use ...." .
Dewfy
Greetings Dewfy,just to let you know your test is flawed after all.1. The innerHTML does not add an element, it just keeps setting one div2. Removing nodes in both cases is done thru DOM, not innerHTML3. Even if you would add nodes thru innerHTML, the slowdown is string concatenation, not innerHTML4. You should take average time for 1 set/remove over a 1000 operations and then compare
tomdemuyt