EPepidemian·Jun 30, 2016
Absolutely! I started a comment yesterday about what i found interesting skimming through the code of this library, but abandoned midways because i could almost see the snarky "oh, so just another templating library" response.
Too be fair, that response would be somewhat justified. After all, the code of the client-side library is so small[1] because it doesn't actually do much there. And that is in fact what i find interesting in comparison to other client-side rendering libraries like React (or Mithril ;).
There's quite a lot more code in the repo though[2], and that has to do with the processing of the view files, and compiling them to plain JS functions at build time. These plain JS, however, are not like most JS functions generated by templating engines, which usually involve generating a bunch of HTML (taking care to escape text as
Read the rest
necessary) and then inserting into the DOM via `innerHTML` or a similar method. Monkberry actually parses the HTML bits of the templates and generates functions that construct the DOM using the JS DOM API. For the example on the homepage, it generates code similar to (you can see this on the browser devtools just by visiting that page):
// Create elements
var li0 = document.createElement('li');
var input1 = document.createElement('input');
...
// Construct dom
input1.setAttribute("type", "checkbox")
li0.appendChild(input1);
// Update functions
this.__update__ = {
todo: function (todo) {
var result;
input1.checked = todo.complete;
...
},
...
}
Notice that the DOM elements are themselves cached and re-used each time the view is updated. And the update function does very direct stuff like setting `input.checked = todo.complete`.
TL;DR: seems like a solid library. Interesting idea and good execution.
[1] https://github.com/monkberry/monkberry/blob/master/monkberry...
[2] https://github.com/monkberry/monkberry/tree/master/src