iris::code

# Elmを1000行書いてみた感想文 Darkmatter Notebook(個人で開発中の[Jupyter Notebook](https://github.com/jupyter/notebook)-likeなCommon Lisp環境)のフロントエンドでReactのpropsみたいな概念が必要になった． Reduxも使いたかったので当初はReact/Reduxでやろうと思ったのだが，そもそもReduxはElm-inspiredらしいということで，Elmを触ってみた． ところで，Jupyter Notebookのエディタ部分は[CodeMirror](https://github.com/codemirror/CodeMirror)によって実現されている． ElmからJSライブラリであるCodeMirrorを利用しようとすると，ラッパーを用意する必要がある．というわけで探してみると，[やはりあった](https://github.com/GabiGrin/elm-codemirror)． しかし対応しているElmのバージョンが古いため，動かせないようだった． せっかくなので，このエディタ部分をElmで実装してみることにした． [進捗がこれ](https://tamamu.github.io/public/ecec)．投稿時点では物理キーボードの入力しか受け付けてくれなかった．IMEからの入力はFirefoxなら動いた． 2日間の進捗にしては動くものが出来たなーという感想．これもElmのアーキテクチャがこういうものに上手くハマったお陰だと思われる． ## 所感 順を辿って感想を述べていく． まず，npmがインストールされていれば環境構築が非常に簡単．パッケージマネージャはelm-package，ビルドするにはelm-makeを叩けば良いというのも便利．index.htmlを別に用意していたからelm-reacterはあまり使えなかったが，全てElmでやるなら便利． そしてアーキテクチャが最高．UIコンポーネントのようなものを作るにあたってはReactを越える作り心地． データバインディングが既存のJSフレームワークに比べて圧倒的に楽だと感じた． 参照透過性のためコンテキストを深追いすることも無く，JSでの開発には戻りたくないという気さえする． 一番不安だったのはパフォーマンスだった．ビルド後は結局JSに落ちるのだから，List操作だけでは効率が悪いと思っていたが，気になる動作遅延は無かった．(これは内部でVirtualDOMを使っているから？) しかしbuilt-inのList操作が苦痛な場面はあり，[list-extra](https://github.com/elm-community/list-extra/tree/7.1.0)を入れてやっとindexingが出来るようになる． 少しダルいと思ったのがイベントの扱いで，未定義のイベントに対して新しいJSONデコーダを定義する必要がある． ## メモ * Html.beginnerProgramから始め，副作用とかが必要になったらHtml.programへ切り替えると良いかもしれない * [elm-css](https://github.com/rtfeldman/elm-css/tree/13.1.1)は使うと記述量が少し減るが，unit周りでの躓きが多かったので使わなくても良いと思う もうちょい色々作ってみて，イケそうだったらこのままElmでフロントエンド開発をやっていく．