11–20 of 44 posts
Performance benefits seem mostly irrelevant, as pointed out by others.
This reminds me of HAML. I've never really seen the benefit of adding a layer that doesn't really add much onto something that is well-known and thus easily maintainable. Performance benefits seem mostly irrelevant, as pointed out by others.
Personal preference of course, but to me the difference is night and day in terms of my productivity with producing markup.
I remember back in the late 90s that generating content on the browser using javascript was the new and greatest thing. Personally it bugs me. But I'm 31, a total fuddy duddy.
If you run a template once, either to generate a form or a simple list, the DOM is faster than innerHTML.
But if you need to repeat a template(loop), use partials or recurse, interpreted DOM manipulations will become a degree of magnitude slower than a compiled function concatenating strings.
Quickly slow enough to loose the snappy effect of client templating.
The output modes are implemented as plugins, so you can also add other sorts of things, like the template mode I'm in the progress of writing, with template inheritance and the like.
Bretthopper's comment about the readability is spot on, though - you have to start using comma-first pretty quickly or you will go mad getting commas in the right places, and you're never going to get a designer writing these things.
The good thing about it is that since your templates are written in code, it's trivial to share them between client and server - this example app can also be clones and run on Node.js, which uses the same templates to serve full pages when you hit any URL and works as a forms 'n links webapp if you disable JavaScript in your browser: http://jonathan.buchanan153.users.btopenworld.com/sacrum/fra...
http://jsonml.org/ (http://webcache.googleusercontent.com/search?q=cache:http://...)
http://jsonml.org/bst/ (http://webcache.googleusercontent.com/search?q=cache:http://...)
My browser does 10,000 operations / second with innerHTML, and 15,000 operations / second with DOM. In every ajax application I've ever made, this is negligible, compared to latency, server processing time, and downloading time. I guess this saves you 1ms for every 30 elements you create? I'm sure there are some cases I'm missing where this might make more of an impact, but from my understanding of the article, this…
var link = el("a#top.link[src='http://google.com'][data-external='true']")
var link = document.createElement('a');
link.setAttribute('id', 'top');
link.setAttribute('class', 'link');
link.setAttribute('src', 'http://google.com');
link.dataset.external = 'true'