Skip to content

Instantly share code, notes, and snippets.

@barneycarroll barneycarroll/Historian.js
Last active Mar 21, 2018

What would you like to do?
const Historian = Object.assign(
Component => {
const histories = new WeakMap
return {
onbeforeupdate({}, old){
if(Component.onbeforeupdate && Component.onbeforeupdate.apply(this, arguments) === false)
return false
histories.set(old.state, old)
...['view', 'oninit', 'oncreate', 'onupdate', 'onbeforeremove', 'onbeforeremove']
.map(key => Component[key] && ({
[key] : v => Component[key](v.state, v, histories.get(v.state))
.reduce((a,b) => Object.assign(a,b), {}),
onbeforeupdate : ({}, old) =>
old.state.old = old,
view: v =>

Use as a decorator:

const Component = Historian({
  view: (vnode, oldVnode) => ''

...or as a functor component:

m(Historian, oldVnode => '')

The decorator enables you to write single-depth, easily invoked reusable components with baked-in behaviour; meanwhile the functor component enables you to reference previous nodes of a different type in place (useful for transitions!).

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
You can’t perform that action at this time.