Package Exports
- nanomorph
This package does not declare an exports field, so the exports above have been automatically detected and optimized by JSPM instead. If any package subpath is missing, it is recommended to post an issue to the original package (nanomorph) to support the "exports" field. If that is not possible, create a JSPM override to customize the exports field for this package.
Readme
nanomorph 
Hyper fast diffing algorithm for real DOM nodes ⚡
Usage
const nanomorph = require('nanomorph')
const bel = require('bel')
var tree = null
tree = nanomorph(bel`<div>hello people</div>`, tree)
tree = nanomorph(bel`<div>hello people</div>`, tree)
tree = nanomorph(bel`<div>nanananana-na-no</div>`, tree)
tree = nanomorph(`<div>teeny, tiny, tin bottle</div>`, tree)Appending to the DOM
const nanomorph = require('nanomorph')
// create the initial tree, save it and append to DOM
const tree = bel`<div>hello people</div>`
const update = create(tree)
document.body.appendChild(tree)
// now each consecutive update will be rendered on the DOM
update(nanomorph(bel`<div>hello people</div>`, tree))
update(nanomorph(bel`<div>nanananana-na-no</div>`, tree))
function create (el) {
var tree = el
return function update (el) {
if (el === tree) {
return tree
} else {
tree.parent.replaceChild(el, tree)
tree = el
return tree
}
}
}API
tree = nanomorph(newTree, oldTree)
Diff a tree of HTML elements against another tree of HTML elements and create a patched result that can be applied on the DOM.
FAQ
Why are you building this?
Experimentin' is fun - all this is is a take on seeing how small we can get with real DOM node diffing. And if we can make some good heuristics happen for efficient tree updates (Merkle trees, anyone?) that'd be nice.
Should I use this right now?
No, probably not but if you do it'll probably be the fastest thing ever. Seriously, I doubt this could be made a lot faster than it is right now, unless we're talking edge cases. But yeah, alright go ahead if you like.
Installation
$ npm install nanomorph