![[PukiWiki]](image/pukiwiki.png "[PukiWiki]")
「[[.NET 開発基盤部会 Wiki>http://dotnetdevelopmentinfrastructure.osscons.jp]]」は、「[[Open棟梁Project>https://github.com/OpenTouryoProject/]]」,「[[OSSコンソーシアム .NET開発基盤部会>https://www.osscons.jp/dotNetDevelopmentInfrastructure/]]」によって運営されています。 -[[戻る>React#i6a6e2f6]] *目次 [#x722733e] #contents *概要 [#u1f5d48d] Facebookの提唱する -observerパターン。 -MV*とは全く違う概念ではなく、延長線上。 -MVVM的だが、バインディングが一方向。 -MVVM的だが、バインディングが（出力の）一方向のみ。 *特徴 [#df153daf] -アプリケーションを以下の4つの[[ドメイン>#l38142a7]]で構築する。 --[[Action>#da7c8dc8]] -- -> [[Dispatcher>#o1ac7ccf]] -- -> [[Store>#p3c60442]] -- -> [[View>#q866d736]] -[[ドメイン>#l38142a7]]間のやり取りを疎結合な機構を用いて以下のように行う。 --ユーザの入力が[[View>#q866d736]]に対して発生したことをロジック側に伝える。 --ロジック処理の結果にデータが変更したことを[[View>#q866d736]]に伝える。 -各[[ドメイン>#l38142a7]]間のメッセージの送信方向は、~ 組み合わせによって必ず一方向に決定される。 Views ---> (Action) ----> Dispatcher ---> (registered callback) ---> Stores -------+ ∧ | | ∨ +-- (Controller-Views "change" event handlers) ---- (Stores emit "change" events) --+ *ドメイン [#l38142a7] **Action [#da7c8dc8] -[[View>#q866d736]]に対するユーザー入力やネットワーク経由の入力を待ち受ける。 -入力を基に[[Dispatcher>#o1ac7ccf]]にメッセージを発行する。 **Dispatcher [#o1ac7ccf] -シングルトンで、インスタンスの管理不要。 -[[Store>#p3c60442]]に向けてメッセージを発行する場合に経由する。 -[[Store>#p3c60442]]間の処理順序の依存性を解決する。 **Store [#p3c60442] -データ処理の領域を取り扱う。 -内部は完全に隠蔽されている。 **View (Controller-View) [#q866d736] Facebookの流儀では、ここで[[React]]を用いて描画コストの問題を解消する。 -ユーザからの入力と -データの出力（表示）を --[[Store>#p3c60442]]のメッセージを購読する。 --[[Store>#p3c60442]]の入力データを出力する。 >取り扱う。 -複数インスタンス作成可能。 -過剰なコンポーネント化~ 複雑な状態の保持や、予期せぬ[[Action>#da7c8dc8]]の呼び出しを発生させる。 *メリット [#q3fb1e2f] 「データが更新された」というメッセージが発行されれば、~ そのメッセージを購読しているビューが勝手に更新される。 -[[ドメイン>#l38142a7]]間の依存性地獄の回避し、煩わしい管理をする必要が無くなる。 -データフローが常に一つになり、処理の予測が可能になる。 -[[ドメイン>#l38142a7]]間の連携が非同期（疎結合）。 *参考 [#t65160af] -Fluxアーキテクチャの概要 | Simplie Post~ http://post.simplie.jp/posts/36 -Fluxアーキテクチャについて調べてみた - しめ鯖日記~ http://www.cl9.info/entry/2016/04/18/233316 -Fluxとはなんなのか~ https://qiita.com/knhr__/items/5fec7571dab80e2dcd92 **[[Redux]] [#p7e2906a] **メリット・事例 [#dcd62a04] -Fluxアーキテクチャの覚え書きを書いた - saneyuki_s log~ https://saneyukis.hatenablog.com/entry/2014/09/26/174750 -Facebook の決断：MVCはスケールしない。ならば Flux だ。~ https://www.infoq.com/jp/news/2014/05/facebook-mvc-flux -Androidアプリ開発にFluxアーキテクチャを導入したら~ 保守性も品質も上がりました - Start Today Technologies TECH BLOG~ http://tech.starttoday-tech.com/entry/android-flux **POSTD [#cdf1604a] -FacebookのFluxアーキテクチャの始め方 --Part 1~ https://postd.cc/introduction-to-facebooks-flux-architecture-1/ --Part 2~ https://postd.cc/introduction-to-facebooks-flux-architecture2/ -さらに多くのことが変化する – Fluxは新しい”WndProc”である~ https://postd.cc/the-more-things-change/ -Reactを用いたアプリケーションアーキテクチャ：Fluxを再考する~ https://postd.cc/application-architecture-with-react-rethinking-flux/
