Mithril v1 shallow component

Mithril components are diffed wholesale.

m.render(elt, m(Foo))

followed by

m.render(elt, m(Bar))

will take down the Foo subtree and build Bar from scratch. This is useful because Components are stateful, and Mithril couldn't guarantee that even handlers are properly cleaned up without wiping the whole subtree on component change.

However, it is sometimes desirable to have different components whose vDOM tree are diffed when swapped. You can achieve it by using the following snippet (or something along these lines):

Not tested, may contain bugs, or not work at all, hopefully it will guide you in the right direction...

function oninit(vnode) {
  vnode.attrs.$$CMP.oninit.call(this, vnode)
  vnode.children = vnode.children.concat(vnode.attrs.$$CMP.view.call(this, vnode))
}
function onbeforeupdate(vnode, old) {
  var res = vnode.attrs.$$CMP.onbeforeupdate.call(this, vnode, old)
  if (res === false) return false
  vnode.children = vnode.children.concat(vnode.attrs.$$CMP.view.call(this, vnode))
}
var hooks = {oninit, onbeforeupdate}

;['onupdate', 'oncreate', 'onremove', 'onbeforeremove'].forEach(function(hook){
  hooks[hook] = function() {
    return vnode.attrs.$$CMP[hook].apply(this, arguments)
  }
})

function pseudocomponent(cmp) {
  return m.fragment(Object.assign({$$CMP: cmp}, hooks), [])
}

                   The Romantic WTF public license.
                   --------------------------------
                   a.k.a. version "<3" or simply v3

           Dear user,

           This code snippet

                                            \ 
                                           \ '.,__
                                          \ '/,__
                                           '/,__
                                           /
                                          /
                                         /
                      has been          / released
                 ~ ~ ~ ~ ~ ~ ~ ~       ~ ~ ~ ~ ~ ~ ~ ~ 
               under  the  Romantic   WTF Public License.
              ~ ~ ~ ~ ~ ~ ~ ~ ~ ~ ~`,´ ~ ~ ~ ~ ~ ~ ~ ~ ~ ~ 
              I hereby grant you an irrevocable license to
               ~ ~ ~ ~ ~ ~ ~ ~ ~ ~ ~ ~ ~ ~ ~ ~ ~ ~ ~ ~ ~
                 do what the gentle caress you want to
                      ~ ~ ~ ~ ~ ~ ~ ~ ~ ~ ~ ~ ~ ~ ~  
                          with   this   lovely
                             ~ ~ ~ ~ ~ ~ ~ ~ 
                              / program.
                             /  ~ ~ ~ ~
                            /    Love,
                       #   /      ~ ~
                       #######     '
                       #####
                       ###
                       #

           -- the author.


           P.S.: Even though I poured my heart into this work, 
                 I _cannot_ provide any warranty regarding 
                 its fitness for _any_ purpose. You
                 acknowledge that I will not be held liable
                 for any damage its use could incur.

pygy/README.md