「マイクロソフト系技術情報 Wiki」は、「Open棟梁Project」,「OSSコンソーシアム .NET開発基盤部会」によって運営されています。
目次 †
概要 †
特徴 †
Single-page application(以下、SPAと略す)は、
- 単一ページで構成される Ajax アプリケーション。
を使用することで、
などが可能となる。
処理方式 †
- サーバサイドは WebAPI を使用して RESTful にAction Methodを実行する。
サーバー・ステートレス †
リッチ・クライアントとしてのフロントエンド
コンポーネント指向 †
最近のSPAはコンポーネント指向
- jQueryのように、ページ中のHTMLをDOM処理するような処理は書かない。
- 横の繋がりも、縦の繋がりも無い(オブジェクト参照的な意味で)。
- 縦はBindingみたいなことはできる(ReactのFluxでは双方向ではなく単方向)。
- コンポーネントの切り方が重要になってくる(下手に切ると上手く実装できなくなる)。
適合 / 不適合 †
適合するケース †
サーバー・ステートレス †
以下のような、リッチ・クライアントとしてのフロントエンド
- WebAPIをマッシュアップするフロントエンド
- mBaaS(Resource Server)のフロントエンド
- サーバーレスのフロントエンド
通信環境 †
Facebookのようなサービスを
配信するケース。
その他の表現 †
- みんなが、様々な場所で使うスマホアプリ
- 項目数が少なめのフロントエンドを
高品質に開発(プロダクトの管理画面)
参考 †
適合しないケース †
エントリー系 †
無限ループが起きるため、
エントリー系で使えそうで使えない(内部でコンポーネントを再描画するため)。
エンプラ(SOR) †
- 画面項目の一括の単項目チェックや関連チェックを実装し難い。
- 特に、コンポーネントなどで分割すると難しくなっていく。
- これがあったので、Update Panelも流行らなかった感がある。
- イベントのチェーンなどはVBでも難しくなるのでSPAでは破綻する。
問題点 †
流行りのアーキテクチャであるものの、昨今、色々な問題点が指摘されている。
フレームワークやツール †
knockoutは早々にメインストリームではなくなって、
React、Angularがメインストリームに切り替わっている。
更に最近は、ReactやVueが伸びてきているもよう。
数(変化)が多い †
その中で、1つ1つに、単純な難しさがあるらしい。 †
ライフサイクルと移行パスに、グレー感がある。 †
- Angularは、1系と2系が結構違うらしい。さらに4系が出てくるらしい。
項目移送の段数が増加する。 †
- 要約すると
- RESTが辛い
- 理由 : データフローが解り難くなる。
非常にシンプルに書ける。
- SQL → DataTable? → Binding
やり方は数パターンあるが、サボって、DataTable?をViewに持って行くこともできる。
ただし、この場合は、双方向 Bindingは不可。単方向Bindingのみ。
- SQL → DataTable? (or Dapper → POCO) (→ ViewModel?) → Binding
物理的 (クライアント・サーバー) & 言語的 (.NET・JavaScript) な境界がありサボれない。
- SQL → DataTable? (or Dapper → POCO) → JSON → ViewModel? → Binding
参考 †
Tags: :プログラミング, :.NET開発, :.NET Core, :ASP.NET, :ASP.NET Web API, :ASP.NET SPA, :JavaScript