PureScriptのUIライブラリまとめ
# おすすめ
選ぶのが面倒なら、ひとまず**Halogen**を選べばいいと思います。ElmやReact/Reduxに似ている**Pux**もわりと人気があるようです
# メンテナンスが継続されているor新しいライブラリ
（半年以内に更新があることを目安にしてます）
## [halogen](https://github.com/slamdata/purescript-halogen)
* 中身の仮想DOM実装は、PureScript製の[purescript-halogen-vdom](https://github.com/slamdata/purescript-halogen-vdom)
* Fluxやelm-htmlみたいにアクションを投げて状態を更新するタイプ
* 状態更新や子のコンポーネントへのクエリまでを含めた計算構造をFreeモナドで定義するガチ勢
* 要素と属性の組み合わせが正しいかどうかまで静的に型付けする機構がある
* [slamdata](https://github.com/slamdata)という会社のひとたちが中心に開発している。Halogenを使った製品を実際に提供しているようなので、実績としては間違いなくこの中で一番上
* 基底のモナドは交換可能だけど基本的には`Aff`
* コンポーネントを組み合わせるとかなり複雑な型になるのがちょっとつらい
* 最も[サンプル](https://github.com/slamdata/purescript-halogen/tree/master/examples)やドキュメントが揃っていてコントリビュータもユーザも多い
* ルーターやCSSを型安全に書くライブラリやなども平行して開発されている(他のUIライブラリからでも使えるが)
* SVGのサポートがまだないことがおそらく唯一にして最大の欠点。本体とは別に、svgサポートを作っている人はいます ([purescript-halogen-svg](https://github.com/kwohlfahrt/purescript-halogen-svg) )
* 抽象度が高く、嵐のように投げつけられる意味不明な型エラーで初心者は頭がおかしくなって死ぬ（慣れれば楽勝）
## [pux](https://github.com/alexmingoia/purescript-pux)
* 中身はReact(でも他の仮想DOMライブラリも使えるっぽい)
* ビューを定義するのにモナドを使う。do記法が使える(他のフレームワークでは配列とか専用Monoid)
* サーバサイドレンダリングなんかもできるらしい
* ルーターも付属
* SVGもサポートされている
* Elmっぽい。すごくElmっぽいので、Elmが好きな人に。
* ~~仮想DOMのサイクルの外部から入力するときにシグナルを使うのが最大の特徴か~~いまサンプルコードをみたらそれもなくなっていて、見るからにElmフォロワー
* この中では一番抽象度が低い。初心者にやさしそう
* Elmっぽくてクセの少ない設計に見えますが、作用の扱いが回りくどくなるのでこれ使うならHalogenでいい気がします
## [thermite](https://github.com/paf31/purescript-thermite/)
* 中身は[React.js](https://facebook.github.io/react/)
* purescript-reactの補助的なライブラリという位置づけのようで、thermite本体は1モジュール400行くらいしかない
* アクションを投げて状態を更新するタイプ
* アクションは単なる代数的データ型
* コンポーネント同士をlensで組み合わせる機構も持つ
* PureScriptのオリジナルの開発者であるPhilさんが開発している
* [Try Thermite!](http://try.purescript.org/?backend=thermite)で実際にブラウザ上で動かしながら練習できる
* SVGがサポートされている
* ~~HalogenやOptic-UIに比べると多少抽象度は低め。比較的初心者にやさしそう~~ 気のせいでした。Optic-UIからのlensでコンポーネントを合成するアイデアも持ち込まれて、強力に抽象化されています
* 私はまだあんまりthermiteを試していないので、また何か気付いたら追記します
## [panda](https://github.com/i-am-tom/purescript-panda)
* 仮想DOMじゃない系
* まだよく調べてないです
## [purview](https://github.com/paf31/purescript-purview)
* これも仮想DOMじゃない系
* たいていの場合はフル機能の仮想DOMいらないんじゃね？という発想で作られた実験的なライブラリ
* philさんが作ってます
## [Turbine](https://github.com/funkia/purescript-turbine)
* FRP系らしい
* まだ詳しく見ていないです
# 汎用でないライブラリ/低レベルなライブラリ
## [purescript-sdom](https://github.com/paf31/purescript-sdom)
* Philさんが実験的に作っている新しいライブラリ。Virtual DOMじゃなくてStatic DOMだそうです
* 完全なdiffとってパッチ当てるのは結構重いし、アプリケーションによってはそこまで柔軟にDOMツリーを組み替えたりしないですし、テキストノードや属性の書き換えだけで十分な場合も多いよね、ということです
* そういう意味では汎用のUIライブラリではないです
* 要素の組み換えはできないといっても、Uniformな要素の配列とかは再描画できるみたいです。なのでTODOアプリくらいは作れそう
* といっても、sdomで済むアプリとそうでないアプリを見分けるのは難しいし、最初はsdomで十分だと思っていたらあとで完全なVDOMが必要だと気づくという場合もあるでしょうし
* これを使うか迷うくらいなら、Halogenでいい気がします
## [purescript-react](https://github.com/purescript-contrib/purescript-react)
* React.jsの低レベルなバインディング
* Thermiteと組み合わせて使うのが吉
## [flare](https://github.com/sharkdp/purescript-flare)
* コードの振る舞いと外見を同時に定義していくという一風変わったライブラリ
* 汎用のUIライブラリではない
* [Try Flare!](http://try.purescript.org/?backend=flare) でブラウザ上で実験できる
## [halogen-vdom](https://github.com/slamdata/purescript-halogen-vdom)
* Halogenで使うために作られた、低レベルな仮想DOM実装です。これを直接使うよりはHalogenを使ったほうがいいでしょう
# あんまりメンテナンスされてないライブラリ
## [outwatch](https://github.com/OutWatch/purescript-outwatch)
* できたて
* 中身はSnabbdom
* Scala版とPureScript版がある
* リアクティブプログラミングを推しだしたライブラリのようです
* まだよくわからないです
## [vdom](https://github.com/bodil/purescript-vdom)
* 既存のJavaScript製ライブラリのバインディングではない、PureScript製の仮想DOM実装
* 作っているのはpulpなんかも作っているBodilさん
* DOMのインターフェイスが抽象化されているので、サーバサイドレンダリングなんかもできるようです
* バインディングではオーバーヘッドが大きいから、PureScriptネイティブな仮想DOM実装あったらいいね、と誰かが言っていたのを見かけたきがしましたが、ついに実装する人が出てきたかと。~~期待してます~~ purescript-halogen-vdomが出てきたのでお役御免っぽい
## [optic-ui](https://github.com/zrho/purescript-optic-ui/)
* 中身はMatt-Esch/virtual-dom
* アクションを管理する機構は持たない
* コンポーネント同士をlensで直接組み合わせることができるのが最大の特徴で名前の由来
* 双方向データバインディングがある
* SVGがサポートされている
* レンダリングする対象まで抽象化されていて交換可能
* イベントハンドラでの基底のモナドは単なる`Eff`で、いろいろ自由が効く
* シンプル寄りだけど抽象度は高く初心者殺し
* **筆者はコレのコンセプトがとても好き**なのですが、非同期処理まわりの技術的な問題が一部解決せず、実用には断念しています([参考](https://github.com/zrho/purescript-optic-ui/issues/15))
## [incremental](https://github.com/sloosch/purescript-incremental)
* incremental-dom バインディング
## [html](https://github.com/philopon/purescript-html)
middle level virtual-dom binding for purescript.だそうです。なんかパフォーマンスがいいらしいです。
## [frp-rabbit](https://github.com/mechairoi/purescript-frp-rabbit)
* ご注文はうさぎですか？
## [spork](https://github.com/natefaubion/purescript-spork)
* Halogenも作ってるnatefaubionさんが作ったライブラリ
* 中身はpurescript-halogen-vdom
* Elmっぽい感じ
* パフォーマンス重視っぽい
* 試作品でいろいろ作りかけみたいです
# 直接使うのはおすすめできない
## [dom](https://github.com/purescript-contrib/purescript-dom)
* 生DOM生バインディング
* 各種UIライブラリの基礎部分として使われる低レベルなライブラリ
* と思いきや、実際には低レベルな部分でもほとんど使われてない
* 型が厳密で純粋なPureScriptは生DOM操作とはとにかく相性が悪いので、『Halogenは難しいからひとまず生DOMで……』というのは本当にお勧めできません
* いろいろ面倒くさいのでメインに据えるのはまったくおすすめできない
* これ以外のUIフレームワークで対応しきれなくなったときだけ補助的に使うのが吉
* ほんとうにクソみたいに面倒くさいわりに、型チェックの関係でどうにも不可能な操作があったりと、どうしようもない
* 繰り返しますがマジでおすすめできない
## [jquery](https://github.com/paf31/purescript-jquery)
* よほどjQueryに思い入れのある人以外おすすめできない。
* なぜこんなものがあるのか、存在意義が謎。
* 何これ？
* 誰が使うの？
* [作った本人も使ってない](https://github.com/purescript-contrib/purescript-jquery/issues/32)っておっしゃっています。
（この記事は同じ筆者が Qiita に投稿した記事の複製です。オリジナル記事)