reactive programming with apache wicket

37
Reactive Programming with Wicket 2016/04/28 Reactive Programming “Object Oriented Approach”を Websシステム開発にとり⼊れた実践事例の紹介

Upload: ryuhei-ishibashi

Post on 07-Jan-2017

1.196 views

Category:

Software


4 download

TRANSCRIPT

Page 1: Reactive programming with Apache Wicket

Reactive Programming with Wicket

2016/04/28

Reactive Programming “Object Oriented Approach”を Websシステム開発にとり⼊れた実践事例の紹介

Page 2: Reactive programming with Apache Wicket

⾃⼰紹介

仕事はJava  

Scalaが好き

Wicket歴3年

Twitter: rysh@cactaceae

Page 3: Reactive programming with Apache Wicket

話すこと

Apache Wicket

ViewとModelの分離

Object-Oriented Reactive Programming

Page 4: Reactive programming with Apache Wicket

話さないこと

Reactive Streams

Functional Reactive Programming

Reactive Extensions

Reactive Application

Page 5: Reactive programming with Apache Wicket

Wicketとは

2004年開発スタート

2015年まで⽣き残った14のJava製Web FWの⼀つ

コミニュティもまだまだ活発

Page 6: Reactive programming with Apache Wicket

なぜWicketでReactive?

⼊社時にWicketが使われていた

諸事情あり

Wicketを使ったプログラミングの効率を追求

Page 7: Reactive programming with Apache Wicket

Wicketの特徴Swing likeなAPIでオブジェクト指向らしく書ける

Viewに使うHTMLは単体でも正しく表⽰できる

再利⽤性が⾼いComponent

AjaxにはJavaScriptを⾃動⽣成して対応

画⾯の差分更新もFWがやってくれる

Page 8: Reactive programming with Apache Wicket

Hello World

Page 9: Reactive programming with Apache Wicket

アーキテクチャ

コンポーネントベース

ステイトフル

J2EEのフィルタ上に実装され、AP Serverで動作

HTTPプロトコルをラップ(隠蔽)して意識させない

Page 10: Reactive programming with Apache Wicket

Wicketプログラミングの基本

あらゆるコンポーネントは継承による拡張が前提

Overrideして振る舞いを変える

Behaivorによる委譲も使える

匿名クラスを多⽤

Page 11: Reactive programming with Apache Wicket

WicketのComponent

HTMLタグや画⾯部品に対応したクラス

必ずComponentクラスを継承している

メンバにIDとModelを持つ

コンポジットパターンでDOMのTree構造を表現している

Page 12: Reactive programming with Apache Wicket

WicketのModel

データのWrapper

Componentに対応するViewにデータバインドで表⽰

Page 13: Reactive programming with Apache Wicket

WicketのModel

Wrapperとしての利⽤例

Page 14: Reactive programming with Apache Wicket

よくあるGUIの問題

ModelがただのWrapperなのでComponentクラス内でデータ取得することになる

Viewのあちこちにビジネスロジックが埋め込まれる

Page 15: Reactive programming with Apache Wicket

Reactive Programming

データフロー (data flows) に着⽬

変更を伝播 (propagation of change)

Page 16: Reactive programming with Apache Wicket

Imperative Programmingb = 1

c= 2

a = b + c

b = 10

print(a) // 3が出⼒

・aは代⼊された時点の値を保持する

Page 17: Reactive programming with Apache Wicket

Reactive Programmingb = 1

c= 2

a = b + c

b = 10

print(a) // 12が出⼒

・右辺の値が変わると左辺に伝播される  (いつ伝播されるかは実装による)

Page 18: Reactive programming with Apache Wicket

SPEEDAのデモ

Page 19: Reactive programming with Apache Wicket

GUIのデータフロー

Page 20: Reactive programming with Apache Wicket

GUIのデータフロー

データフロー を グラフで表現

Page 21: Reactive programming with Apache Wicket

変更の伝播

データモデル間の伝播

データモデルから画⾯への伝播

ユーザーインプットをデータモデルに伝播

Page 22: Reactive programming with Apache Wicket

変更の伝播

データモデル間の伝播

データモデルから画⾯への伝播

ユーザーインプットをデータモデルに伝播

Wicketが標準機能でサポート

Page 23: Reactive programming with Apache Wicket

変更の伝播普通は遅延評価を使って常に最新の値がとれるようにする

Javaの⾔語機能には遅延評価はない

Wicketの標準コンポーネントにはLoadableDetacheableModelというクラスがあり、これはレンダリング時にモデルの内容を読み込むという遅延評価を⾏っている

この遅延評価を⾏うモデルをチェインして伝播を実現

Page 24: Reactive programming with Apache Wicket

遅延評価を⾏うモデルWrapperとしての利⽤例

遅延評価を⾏うモデルの例

Page 25: Reactive programming with Apache Wicket

遅延評価のメリット

Wrapperの場合、初期化時に全データをロードする

遅延評価を⾏うと表⽰に使われないデータはロードされない

制御コードを書かなくていいので可視性も向上

Page 26: Reactive programming with Apache Wicket

グラフ実装の課題と対策愚直にグラフを実装すると全貌が⾒えづらくなる

データ同⼠の関連は画⾯の要求に基づいているため、バックエンドのデータモデルと乖離

MVVMパターンを適⽤しバックエンドのデータモデルをそのまま利⽤。

⼀部のケースではEventを併⽤

Page 27: Reactive programming with Apache Wicket

実現できたこと

ViewとModelの⾃然な分離

⾃律的なComponentの実装

全てのComponent階層で再利⽤可能

簡潔でトレーサビリティの⾼いコード

Page 28: Reactive programming with Apache Wicket

終わり

Page 29: Reactive programming with Apache Wicket

追加のTopic

Page 30: Reactive programming with Apache Wicket

Wicketの Pros/Cons快適にオブジェクト指向プログラミングできる

デフォルトでオンメモリキャッシュが効いているようなものなので速い

スケール/Continuous Deliveryしずらい

起源が古くAjaxやEventは後付けの設計

ドキュメントやサンプルコードは古いスタイルの物が多い

デフォルトの設定も昔の常識に沿ったままなのでいろいろ設定が必要

Wicketʼs request processing is delicate monster…

Page 31: Reactive programming with Apache Wicket

Wicketのスケールアウト

ステイトフルなのでsession情報を共有が必要

スケールしようとするとステイトフルだったメリットがデメリットになって襲いかかってくる

UZABASEではSessionサーバーをnettyベースで⾃作

Page 32: Reactive programming with Apache Wicket

Eventを使うケース

Ajaxによって再描画するコンポーネントをAjaxRequestTargetにAddする時

特定のアクションがあった時だけ評価式が変わる 時(グラフの構造が変わる)

Page 33: Reactive programming with Apache Wicket

Wicketの⼈気は?

Page 34: Reactive programming with Apache Wicket

Wicketの⼈気は?

wicketには、英語では「⼩さな⾨」「(銀⾏などの)格⼦窓⼝」の意味の他、クリケットで使⽤される「3本の杭と、杭の上部に2本の横⽊を乗せた柱状のもの」(三柱⾨)の意味がある。Wikipediaより

Page 35: Reactive programming with Apache Wicket

Wicketの⼈気は?

Page 36: Reactive programming with Apache Wicket

Wicketの⼈気は?

察してください

Page 37: Reactive programming with Apache Wicket

終わり