寝ていた。朝にすこしだけ作業して、一眠りしたら昼過ぎになってしまった。

2016-09-01 に書いたとおり、Raynos/mercury を TypeScript で再実装した。おそらく公開しない。あと mercury で何かつくる案はなしにする。

mercury を読んだ感想は 2016-09-01 のざっと見た感じと大きくは変わらない。TypeScript で書き直して、分かったことを追記する。

Raynos/observ / Raynos/observ-struct / nrw/observ-varhash 。observ はやはり状態の変更監視に使われていた。気になるのはその API が型を設定しづらいところ。get と addListener がひとつの関数で、set がはえている。いびつだと感じる。また listener を同期的に呼び出している点や try catch していない点も気になった。

Raynos/dom-delegator / Raynos/value-event 。Event Listener のための utility 。mercury では channels の実装に使われている。このあたりのつながりは実装から追うとすこし分かりづらくなっている。こういった utility は virtual-dom のような薄い Virtual DOM 実装を使うと欲しくなりそうだ。

このあたりのつながりを https://github.com/Raynos/mercury/blob/v14.1.0/examples/number-input/number-component.js を改変した例で見てみる。

function NumberInput() {
  return hg.state({
    value: hg.value(0),
    channels: {
      increase(state) {
        state.value.set(state.value() + 1);
      }
    }
  });
}

NumberInput.render = function render(state) {
  return h('div', [
    h('input', {
      type: 'button',
      value: 'increase',
      'ev-click': hg.send(state.channels.increase)
    }, 'increase')
  ]);
};

hg は mercury だ。hg.state や hg.value は observ だ。channels には event listener を置く。実装から追うと難しいが、こうしてみるとよくある View & ViewModel になっている。View & ViewModel をつなぐところに this を使っていないため、好き嫌いは出そうだ。

個人的には observ の API を好きになれないので、あまり使いたくない。幸い mercury はそこを必須としているわけではない。channels を使わなくても任意の関数を設定すれば良い。最終的に mercury の main の第二引数に渡した関数へ渡される callback を呼び出せば view が更新される。

そこまでして mercury が使いたいかと言われればよく分からない。

dom-delegator の実装を読む過程で Raynos/weakmap-shim の一部を TypeScript で再実装してみたのを gist に書いたのでこちらはメモしておく。また observ を読む過程での gist もメモしておく。

話は変わって、金曜ロードショーで映画『オール・ユー・ニード・イズ・キル』を観た。原作や漫画を読んでいないのだけど、最後のループで何が起きたのかピンとこなくてすっきりしない。