Universal VDOM

Proof of concept: with the same controller and view outputs React.js and Mithril components

Goal: as a frontend library author I'd like to target as many frameworks as possible. My components might return a universal VDOM and then compile them to different frameworks.

-> Reddit dicussion on VDOM

Source (Gist)

// testable view: you can inject a state or a mock controller
function view(state, controller) {
  return {
    tag: 'div',
    children: [
      {
        tag: 'h3',
        children: state.count
      },
      {
        tag: 'button',
        attrs: {
          className: {'btn': true, 'btn-primary': true},
          onClick: controller.doIncrement
        },
        children: 'Click me'
      }
    ]
  };
}

function controller(state, setState) {
  return {
    doIncrement: function () {
      setState({count: state.count + 1});
    }
  };
}