3 ms·
I used to do DOM editing in my app that uses webkit. I changed it to use innerHTML, because the DOM was just too slow. I agree that manipulating the DOM looks
by pieter 17y ago
I used to do DOM editing in my app that uses webkit. I changed it to use innerHTML, because the DOM was just too slow.
I agree that manipulating the DOM looks nicer. But if it saves 1 second of stalling, I'll use the innerHTML method any time.
- khafra 17y agoMibbit feels pretty durned fast to me, for a rich web-app.
- axod 17y agoIt'd have to be a lot slower for me to stand things like this in the code: e.innerHTML = "Hello & world, here's some HTML <span>Some html</span>"; over e.nodeValue = "Hello & world, here's some HTML <span>Some html</span>"; Also you better be 100% sure you're data is 'safe' if you use innerHTML. eg e.innerHTML = "Hello "+some_user_provided_data+"!";
- willwagner 17y agoI'm confused by this comment. I don't think you can shove arbitrary html into a nodeValue, although you can do it with innerHTML. Using your example, this works fine: e.innerHTML = "Hello & world, here's some HTML <span>Some html</span>"; I believe the intent of the original author was to point out that basic DOM manipulation methods like appendChild, removeChild, etc are slower than innerHTML, which in almost all cases, is true. Whether it's worth doing so is another matter. If you have a fairly complex document, inserting multiple children can slow things down quite a bit as the browser has to reflow the document between each insert/append. Bulking them up in an array of strings, joining them, and inserting them into an innerHTML makes the reflow happen only once. The document fragment approach can help a lot over multiple appends/inserts, but it has some tradeoffs too as far as performance. Duly noted about user provided data though being a security risk.
- axod 17y agoMy point was that having to escape things like open close tags, ampersands etc looks horrible and ugly. HTML entities inside HTML code inside strings isn't something I enjoy looking at. (My example code shows some HTML code as plain text, which needs htmlEntities when using innerHTML). You can't put anything in nodeValue apart from a string value. But the good thing is, it's just a string. No security issues, no entity encoding, no html tag issues.
- willwagner 17y agoI see your point; I misread it first time around. From a security point of view for user content, nodeValue is a much better approach.
- davidw 17y agoAre there any actual... benchmarks out there? That might be a good way of looking at the issue in a more objective way.
- axod 17y agohttp://www.quirksmode.org/dom/innerhtml.html http://www.quirksmode.org/dom/innerhtml.html As I posted :/ just click on the buttons and it'll test in your browser.