leonidas / transparency

Transparency is a semantic template engine for the browser. It maps JSON objects to DOM elements by id, class and data-bind attributes.
http://leonidas.github.com/transparency/
MIT License
969 stars 112 forks source link

String manipulation instead of DOM manipulation #5

Closed pyykkis closed 12 years ago

pyykkis commented 12 years ago

Currently, Transparency does direct DOM manipulations for all data elements. In worst case, this is order of magnitude slower than string manipulation and a single DOM update.

Refactor Transparency to use string manipulation internally. No changes to external API.

miohtama commented 12 years ago

Are you talking about DOM vs. innerHTML performance?

miohtama commented 12 years ago

http://jsperf.com/dom-vs-innerhtml/10

pyykkis commented 12 years ago

Yes.

However, based on other benchmarks, I thought string manipulation + innerHTML is faster than DOM manipulation.

I did some trials with DOM fragments, too, but they might be worth further investigation. At least it would be a lot easier to implement.

miohtama commented 12 years ago

This also might be great interest for you:

http://hacks.mozilla.org/2011/11/insertadjacenthtml-enables-faster-html-snippet-injection/

pyykkis commented 12 years ago

Thanks! I'll take a look.

pyykkis commented 12 years ago

It turned out that with proper caching, DOM manipulation is faster than any other option. Luckily, it was also the easiest one to implement. Closing, as Transparency is probably a lot faster than anything else out there.