JSPM

nanodiff

1.0.0
  • ESM via JSPM
  • ES Module Entrypoint
  • Export Map
  • Keywords
  • License
  • Repository URL
  • TypeScript Types
  • README
  • Created
  • Published
  • Downloads 1
  • Score
    100M100P100Q20238F
  • License MIT

Embeddable DOM diffing algorithm

Package Exports

  • nanodiff

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 (nanodiff) to support the "exports" field. If that is not possible, create a JSPM override to customize the exports field for this package.

Readme

nanodiff stability

npm version build status test coverage downloads js-standard-style

Embeddable DOM diffing algorithm. Currently a fork of morphdom with hooks and IE7 support removed, and event copying added, but will probably change in the future.

Usage

const nanodiff = require('nanodiff')
const bel = require('bel')

var tree = null

var el1 = bel`<div>hello people</div>`
var el2 = bel`<div>nanananana-na-no</div>`
var el2 = bel`<div>teeny, tiny, tin bottle</div>`

update(el1)
update(el2)
update(el3)

function update (el) {
  if (!tree) {
    tree = el
    document.body.appendChild(tree)
  } else {
    tree = nanodiff(el, tree)
  }
}

API

tree = nanodiff(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.

Installation

$ npm install nanodiff

See Also

License

MIT