ECMAScript7を見据えた、JavaScript(TypeScript)で使えるFRPライブラリの比較調査

# 動機
[Reactive Streams](http://www.reactive-streams.org/)という非同期ストリーム処理標準化の流れがきているし、[ECMAScript7でObservableが入りそう](https://github.com/jhusain/asyncgenerator#introducing-observable)。

|            | 同期                                                        | 非同期                                                               |
|:-----------|:------------------------------------------------------------|:---------------------------------------------------------------------|
| 単数データ | （Arrayを含まない）Object<br>`{}, 1, "foo", var y = f(x)`   | Promise<br>`Promise.then(callback).then(callback)`                   |
| 複数データ | Array（[ES6でIteratorが入りそう](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Iteration_protocols)）<br>`[1, 2].filter().map()` | **Stream/Observable**<br>`Observable.filter.map.subscribe(callback)` |

（図は[Functional Reactive Programming with RxJS](http://www.slideshare.net/stefanmayer13/functional-reactive-programming-with-rxjs)を参考にした。）

Observableは非同期処理に超絶便利なので、JavaScriptでも今から似たようなものを使いたい。

ただ、将来的にES7の標準に乗り換えたいので、それを軽く見据えて調査する。

# 比較表
| 名称                                                      | 安定性 | 古いブラウザ互換性 | ライブラリサイズ | パフォーマンス | 多言語 | 情報量     | JQueryとの協調 | TypeScript用型定義 |
|:----------------------------------------------------------|:-------------|:-------------------|:-------------------------------|:---------------|:-------|:-----------|:-------------------|:-----------------------|
| [RxJS](https://github.com/Reactive-Extensions/RxJS)       | 安心         | あり               | 大（[RxJS-Modular](https://github.com/Reactive-Extensions/RxJS-Modular)というモジュール版ができはじめたので、それを使えば必要最低限で済みそう）     | 普通           | O      | かなり多い | O                  | 公式である             |
| [Bacon.js](https://github.com/baconjs/bacon.js/)          | 安心         | あり               | 中                          | 重い           | X      | 多い       | O                  | ある                   |
| [Kefir.js](https://github.com/pozadi/kefir) | 不安         | 明示されていない   | 小                          | 軽い           | X      | 少ない     | O                  | ない                   |

# 各ライブラリの特徴
## RxJS
RxJSはC#発祥の[Reactive Extensions](http://reactivex.io/)のjs移植。基本的に他言語でも統一された仕様に従っている。
RxJS = Observables + Operators + Scheduler ということになっている。

Observableには[HotとCold](http://qiita.com/toRisouP/items/f6088963037bfda658d3)という注意すべき特性があり、とくに型で区別している訳でもなく、メソッドで判別しなければいけないので難しい。

Rxからほとんどのメソッドを導入しているので、メソッドが非常に多いが、機能の少ないlite版もある。

## Bacon.js
Bacon.jsはRxJSが非オープンソースでドキュメントが少ない時代に作られ始めたらしい。（[reactive-bacon](https://github.com/raimohanska/reactive-bacon)が前身っぽい）
設計思想的にはRxJSより一貫性があるとされる。

RxJSのHot, Coldという特性の違いが気に入らず、Coldを廃したような挙動にしている。
EventStreamとPropertyという2種類のストリームに分けているが、Observableのインターフェースを持ち、共通のメソッドも多い。

また、RxJSと違ってデフォルトではエラーイベントでストリームを終わらせない。


参考：
- https://github.com/baconjs/bacon.js/#why-bacon
- https://github.com/baconjs/bacon.js/#for-rxjs-users

## Kefir.js
Kefir.jsはBacon.jsとRxJSの影響を受けつつ、速度と省メモリを主目的にしている。

Bacon.jsのようにObservableをStreamとPropertyという2種類に分けている。
Baconもそうだが、[Streamは離散的に、Propertyは連続的に値を持つ](https://pozadi.github.io/kefir/#about-observables)ので、Subscribeで渡したコールバックが実行されるタイミングが違う。

# 安定性
3つのライブラリはどれもテストが豊富に書かれている。
RxJSとBacon.jsはissueが同じくらい挙がっていて順次処理されている。

RxJSは、オープンソース化する前も含めると[少なくとも2010年](http://neue.cc/2010/12/20_290.html)から開発されている。
Bacon.jsは、前身のReactive-Baconが[2012年](https://github.com/raimohanska/reactive-bacon/graphs/contributors)から開発されている。
Kefir.jsは、[2014年](https://github.com/pozadi/kefir/graphs/contributors)から開発されているが、[1系がリリースしたばかり](https://github.com/pozadi/kefir/releases/tag/1.1.0)でまだ枯れていない感じがある。

# 古いブラウザ互換性
- [RxJS](https://github.com/Reactive-Extensions/RxJS#compatibility)
- [Bacon.js](https://github.com/baconjs/bacon.js/#compatibility-with-browsers)
- Kefir.jsは書いていない。[jasmineによる単体テスト](http://pozadi.github.io/kefir/test/in-browser/SpecRunner.html)をIE11の互換性モードで開くとテストは全て通ったが、保証ではないと思う。

# ライブラリサイズ
- [RxJS](https://github.com/Reactive-Extensions/RxJS/tree/master/dist)
- [Bacon.js](https://github.com/baconjs/bacon.js/tree/master/dist)
- [Kefir.js](https://pozadi.github.io/kefir/dist/kefir.min.js)

で確認。

Rxについては、モジュール版の[RxJS-Modular](https://github.com/Reactive-Extensions/RxJS-Modular)というのが作られ始めたので、それを使うと少なくて済みそう。

# パフォーマンス
[RxJS, Bacon.js, Kefir.jsのベンチマーク](https://github.com/Reactive-Extensions/RxJS/blob/master/doc/mapping/bacon.js/whyrx.md)でメモリ使用量について言及されており、
Kefir.js、RxJS、Bacon.js、の順に悪くなるとされている。

[Kefir.js, Bacon.jsのベンチマーク](https://pozadi.github.io/kefir/demos/tree.html)では、目に見えてKefir.jsのパフォーマンスが良い。

ただ、よほどリアルタイム性や省メモリが重視される用途でなければ、どれを選んでも問題なさそう。
[比較的重いとされるBacon.jsでも、特に問題は聞いていないと書いてある。](https://github.com/baconjs/bacon.js/wiki/FAQ#isnt-it-slow-how-is-the-performance)

ちなみに[RxJS 2.3.25](https://github.com/Reactive-Extensions/RxJS/releases/tag/v2.3.25)からベンチマークが追加されていた。

# 他言語対応
RxJSは、Rxがたくさんの言語で実装されているので、学習すると他言語で知見を活かせる。

とはいえ、BaconもKefirもRxJSと似通っているので、それを選んだから知見が無駄になるということもない。

# 情報量
RxJSはRx自体の記事も多いので、文献は豊富。APIの図解も[Reactive Extensionsのもの](http://reactivex.io/documentation/operators.html)を見れば載っている。

Bacon.jsも記事はそれなりにある。

Kefir.jsは最近1系になったばかりで、まだ全然ない。

# JQueryとの協調
RxJSにはfromEventとfromPromise、Bacon.jsにはasEventStreamとfromPromiseがあり、JQueryのイベントやPromiseをObservableに変換できる。
Kefir.jsには[JQueryPlugin](https://github.com/pozadi/kefir-jquery)がある。

# TypeScript用型定義
やっぱり型い言語で書きたいので、調べた。

RxJSには公式の型定義ファイルがあるのでTypeScriptですぐに使える。ただ、若干間違っている部分があったりする。
[Bacon.jsにはある](https://github.com/bodil/baconts)が、追従しているかは調べていない。
Kefir.jsには型定義ファイルがない。

# どれが一番ES7に乗り換えやすそうか？
まだ[async generator](https://github.com/jhusain/asyncgenerator#introducing-observable)は[Strawman段階](https://github.com/tc39/ecma262)なので仕様も変わる可能性が大いにあり、何とも言えない。

だが、ES7のObservableは既存のライブラリを参考にしていることもあり、合成できるよう設計されているし、どれを選んでも大きく逸脱しないだろう。

現状、Observableの性質の分類に対する思想がライブラリ間で違うが、ES7になって標準Observableに収斂してそういう分類が消えるのではなく、標準Observableのインターフェースを持ちつつ細分化したライブラリが出てくることも考えられるので、分類思想の違いが消滅して無駄になることもない、かも。

# 結論
現状ではES7がどうなるか不確定なので何も言えない。
ES7にObservableが入らないならこれらのライブラリに頼るしかないし、入るならこれらのライブラリを参考にすると思うので、ES7のことを意識しないで、好きなのを使っていいんじゃないかな。

- 安定性・TypeScriptですぐ使う・他言語で知見を活かす　ならRxJS
- 安定性・一貫性のあるObservable重視　ならBacon.js
- 軽量・性能重視　ならKefir.js