bouzuya/my-cycle で cyclejs/cycle-core を TypeScript で再実装したことを書く。

bouzuya/my-cycle は Cycle.js (core / dom / http) を TypeScript で再実装しようというもの。現状は cycle-core のみで test もない。

Cycle.js は React → Flux の要素を踏まえつつ RxJS を採用している framework のひとつだ。React から Virtual DOM を、Flux から一方向の data flow を得ている。RxJS は event stream を明示し方向を強制する意図だろうか。その他には副作用を Driver に抽出する点や event listener の設定を query の形で抽出している点は大きな違いだと思う。

目的は Virtual DOM と RxJS を活用した framework を実例から学ぶことだ。ただ写経するのでは芸がないので JavaScript から TypeScript へ、 RxJS 4 から RxJS 5 への変換をしている。

ひとまず cycle-core から。量もほとんどないので愚直に写経している。

気になった点は 2 つ。

まず型情報がとても怪しい。

たとえば driver との in / out 。in が Observable<any> で、 out が any だ。どちらも個別に見れば指定できるのだけど、cycle-core 側から見るとき統一できない。Object の key 別に異なる driver を持つので、うまく指定できない (できるのかもしれないけど、ぼくは知らない) 。 { [driverName: string]: any } のような妥協した型情報になっている。

あとは RxJS 4 から RxJS 5 に移行することで operator の増減・改名があった。たとえば dispose が unsubscribe に変わった。

そんなところかな……。

引き続き cycle-dom に取り組む。