cache-element
Memoize a bel element
Last updated 4 years ago by yoshuawuyts .
MIT · Repository · Bugs · Original npm · Tarball · package.json
$ cnpm install cache-element 
SYNC missed versions from official npm registry.

cache-element stability

npm version build status downloads js-standard-style

Cache an HTML element that's used in DOM diffing algorithms that respect element.isSameNode().

Usage

var cache = require('cache-element')
var html = require('bel')

var nav = cache(function () {
  return html`
    <nav>
      <div>All content</div>
      <div>In here</div>
      <div>Is static</div>
      <div>And doesn't need to be diffed</div>
      <div>On every render</div>
    </nav>
  `
})

document.body.appendChild(nav.render())

API

element = cache(render)

Create a new instance of cache-element. Takes a render function that is called when element.render() is called and a prior call doesn't have a node mounted on the DOM.

element.render()

Render the element to append it on the DOM. As long as the Node is on the DOM, subsequent calls to element.render() will return an empty node that has a .isSameNode() method on it so diffing algorithms that respect this property will skip diffing this node.

Installation

$ npm install cache-element

See Also

License

MIT

Current Tags

  • 3.0.1                                ...           latest (4 years ago)

9 Versions

  • 3.0.1                                ...           4 years ago
  • 3.0.0                                ...           4 years ago
  • 2.0.1                                ...           4 years ago
  • 2.0.0                                ...           4 years ago
  • 1.1.3                                ...           4 years ago
  • 1.1.1                                ...           4 years ago
  • 1.1.0                                ...           4 years ago
  • 1.0.1                                ...           4 years ago
  • 1.0.0                                ...           4 years ago
Maintainers (2)
Downloads
Today 0
This Week 1
This Month 10
Last Day 0
Last Week 9
Last Month 10
Dependencies (1)
Dev Dependencies (2)
Dependents (2)

Copyright 2014 - 2016 © taobao.org |