from Elm

Kagura, Halogen, Reduxに影響を与えた

4つの概念

Model

アプリケーション全体の状態を表す型

Reduxでいうstore

Update

状態を更新する関数

reduxのreducer

Msg

アプリケーション内で起こるイベントの定義

reduxのaction

View

一つ一つのHTML要素が Html Msg 型を返す関数

Reactがやってるとこ

Elmランタイムと遣り取りをする方法

Html

DOM生成してランタイムに渡す

Browser.sandbox を使う

Command

ランタイムに処理を実行させ、結果をメッセージとして受け取る

Browser.element を使う

ex. HTTPリクエスト, 乱数, 現在時刻の取得

Subscription

ランタイムにイベントを監視させ、通知を受け取る

Browser.element を使う

ex. WebSocket, 時間を扱うとき, ウィンドウサイズの取得

TEAはフレームワークなので、アプリケーション全体のアーキテクチャが決まるわけではない

TEAがカバーしていないところで設計ミスが起きたことがあったらしい

Modelは本来は分割しないが発表者は分割したらしい

失敗したらしい

めっちゃ複雑になったらしい

以下のようにして回避した

TEAはcoreのままにして、補助用の関数を増やしていった

swift

Component設計

ここでいうComponentとは

ReactのCopmonentみたいに、各自でstateを持っているようなViewのこと

Elm文脈で言えば、各ViewがTEAを持っている

プロジェクト全体で見ればTEA構造の階層がいくつか存在する感じになっている

上の記事で言っているのは、そもそもComponentは不要で、Viewは全部関数で作ればいいやん、というもの

だからたぶんModelが1箇所のみに集まっている状態を良しとしている

Componentの再利用自体をアンチパターンと捉えている