virtual-raf

Create a RAF loop for virtual-dom

Usage no npm install needed!

<script type="module">
  import virtualRaf from 'https://cdn.skypack.dev/virtual-raf';
</script>

README

virtual-raf

NPM version build status Test coverage Downloads js-standard-style

Create a RAF loop for virtual-dom.

Installation

$ npm install virtual-raf

Usage

const vraf = require('virtual-raf')
const vdom = require('virtual-dom')
const h = require('virtual-dom/h')

function render (state) {
  return h('div', [state.count])
}

const tree = vraf({ count: 1 }, render, vdom)
document.body.appendChild(tree.render())

tree.update({ count: 2 })

API

tree = vraf(state, render, vdom)

Create a virtual-dom tree based on a state and render function.

tree.render()

Mount the virtual-dom tree on a DOM node.

tree.update(state, [render])

Update the tree with an optional new state and render function.

See Also

  • main-loop - A rendering loop for diffable UIs
  • render-loop - Async DOM render loop with virtual dom diffing and Hyperglue

License

MIT