JAXBとテンプレートエンジンMixer2

日本Javaユーザーズグループ クロスコミュニティカンファレンス2013春 講演
WebデザイナーフレンドリーなJavaテンプレートエンジン"Mixer2"

Transcript

1. テストページ 1 1 • 機内モード確認 • ストップウォッチ スタート確認
2. テストページ 2 2 • 機内モード確認 • ストップウォッチ スタート確認
3. プロローグ PROLOGUE 3
4. 1999 Java Server Pages 4
5. 当時の業界記事 Sun、「JavaServer Pages」の仕様を公開 http://java.sun.com/products/jsp/ Sun Microsystems社は2日、「JavaServer Pages（JSP）」技術を発表した。 ．．．MicrosoftのActive Server Pages （ASP）に替わるテクノロジーとして．．． 5 出典：http://internet.watch.impress.co.jp/www/article/1999/0603/jsp.htm
6. 2013 6
7. ©技術評論社
8. Q. 実際、ビューとして何を使ってますか？ A) JavaScript + JSON/XML B) Velocity, Mayaa, etc C) JSP
9. 21世紀ですよ。
10. JAXBとテンプレートエンジン Mixer2 － さらばJSP － 10 JJUG CCC 2013 Spring 日本Javaユーザーズグループ クロスコミュニティカンファレンス R5-1 ベルサール西新宿 2013-05-11
11. 自己紹介 • わたなべ • SI屋の技術屋さん • @nabedge • http://nabedge.blogspot.jp 11
12. 目次 1.テンプレートエンジン 2.JAXBとMixer2 3.性能比較 4.Mixer2の欠点 5.ビューのテストをJUnitで 6.エピローグ 12
13. テンプレートエンジン 13 JSP：一番身近なテンプレートエンジン こんにちは <% if (name == null) { %> ゲストさん <% } else { %> <%= name %>さん <% } %> 通常のJava言語、EL式、カスタムタグで書く
14. テンプレートエンジン 14 Velocity：老舗 こんにちは #if (name == null) { ゲストさん #else ${name}さん #end VTL = Velocity Template Languageで書く
15. テンプレートエンジン 15 FreeMarker：最近人気 こんにちは <#if name?has_content> ${name}さん <#else> ゲストさん </#if> FTL = Freemarker Template Languageで書く
16. 要するに？ たいていのテンプレートエンジンは、 何らかの テンプレート記述言語（っぽいもの） を覚えなければならない 16
17. Mixer2 17 こんにちは <span id=“name”>ななし</span>さん Span span = html.getById(“name”, Span.class); span.getContent.clear(); span.getContent.add(“ヤマダ”); // これで <span id=“name”>ヤマダ</span>さん // が出力 テンプレートは純粋なXHTMLとCSS 値の埋め込みやロジックは普通のJava
18. Take back control ! Java-Webアプリケーションの Viewを、 本来の純粋な Javaプログラミングと htmlマークアップの世界に 取り戻す！ 18
19. 19 1.テンプレートエンジン 2.JAXBとMixer2 3.性能比較 4.Mixer2の欠点 5.ビューのテストをJUnitで 6.エピローグ
20. JSR-222 Java Architecture for XML Binding 20
21. JAXBによるmarshalとunmarshal 21 JAXB API <root> <foo>aaa</foo> <bar>bbb</bar> <foo>ccc</foo> <bar>ddd</bar> </root> root foo bar アンマーシャル マーシャル XML文字列 Javaオブジェクト
22. Mixer2によるロードとセーブ 22 Mixer2 &JAXB <html> <head> … </head> <body> … </body> </html> Html Head Body loadHtmlTemplate saveToString XHTML Javaオブジェクト
23. Mixer2のHTMLタグとJava型 23 <html>…</html> ⇔ org.mixer2.jaxb.xhtml.Html <div>…</div> ⇔ org.mixer2.jaxb.xhtml.Div • Mixer2では HTMLタグと Javaオブジェクトを相互マッピング JAXBのXJCで自動生成した約120種 のJavaクラスを利用
24. タグの属性へのアクセス 24 • タグの属性はJavaオブジェクトの プロパティにマッピング。 • setter/getterメソッドでアクセス。 <div id=“foo”>…</div> をテンプレートとしてロードすると String id = div.getId(); // これでidに”foo” （html4/5のすべての属性を実装済み）
25. 複数要素はListになる 25 <html> <body> <p>Hello World</p> foo <span>bar</span> </body> </html> index 型 0 P 1 String 2 Span Html html = mixer2Engine .loadHtmlTemplate( “template.html”); java.util.List<Object> list = html.getBody() .getContent(); listの中身 template.html
26. 26 デモ サンプルWebアプリ 「フルーツショップ」 https://github.com/nabedge/mixer2- sample/tree/master/mixer2-fruitshop-springmvc • 時間を確認 • 15分～20分くらい？
27. MVCフレームワークとMixer2 1. ViewエンジンとしてのMixer2 2. なんらかのMVCフレームワーク SpringMVC, Struts2, SAStruts... 3. 組み合わせれば鬼に金棒 Spring勉強会の資料も参考にどうぞ。 http://nabedge.blogspot.jp/2013/02/spring-study.html 27
28. コアなファンのありがたい賛辞 28
29. 29 1.テンプレートエンジン 2.JAXBとMixer2 3.性能比較 4.Mixer2の欠点 5.ビューのテストをJUnitで 6.エピローグ
30. コアなファンによる ざっくり比較 30 このツッコミもかなり当たってます
31. 自分でもテストしてみた 1. フルーツショップの商品詳細ページ →JSP, Velocity, Thymeleaf, Mixer2で 同じ画面を作る 2. ApacheJMeterでhttpアクセスを浴びせる 31
32. 前のページは正確な性能比較か？ 32 START END 1. 15ms以下だと観測誤差が大きい（CPU/OS次第） 2. 総時間での比較はノイズありすぎ （でもjspと比較するにはこうするしかない） VIEW処理 httpリクエスト コントローラ 処理 ビジネスロジック httpレスポンス
33. とにかく、体感速度としてはどうなの？ 33
34. 34 1.テンプレートエンジン 2.JAXBとMixer2 3.性能比較 4.Mixer2の欠点 5.ビューのテストをJUnitで 6.エピローグ
35. Mixer2の欠点 1. 性能 →気にするほどの影響かどうか？がポイント 2. HTML ではなく XHTML が必須 →HTML5もXML文法で書けばOK 3. <!-- コメント --> は消えてしまう →どうでもいい？ 4. スクリプトレットが無い代わりにJavaコー ドが肥大化する →Ctrl+Space補完が効くならいいのでは？ 35
36. ちょっと一息 36 • 水分補給 • 時間を確認 • 35分前後?
37. 37 1.テンプレートエンジン 2.JAXBとMixer2 3.性能比較 4.Mixer2の欠点 5.ビューのテストをJUnitで 6.エピローグ
38. よく見かける開発ルール、スローガン 『ちゃんとJUnitでテスト書こうぜ！』 ※ただしJSPは除く 38
39. SeleniumはUT用ではありません • selenium-java-2.*.jar • テスト対象をWebアプリとして APサーバ上で稼働させておくのが 前提条件。 • つまり、単体テストではなく 結合テストの回帰実行をするための もの。 39
40. Mixer2とJUnitの基本 40 タグ型 オブジェクト 加工前 タグ型 オブジェクト 加工後 処理 span.unsetContent(); span.getContent().add(“Hello”); assertThat( span.getContent().get(0).toString() ,is(“Hello”));
41. Mixer2によるViewヘルパーのテスト 41 実際のテストコードで説明します https://github.com/nabedge/mixer2- sample/blob/master/mixer2-fruitshop- springmvc/src/test/java/org/mixer2/samp le/web/
42. エピローグ EPILOGUE 42
43. 「さらば JSP」？ うん、あれは、釣りです。 ごめんなさい。 43
44. ハサミは使いよう • 心配性の人は枯れてるJSPで。 • Velocityが慣れている人は Velocityで。 • TwitterやFacebookみたいな 画面が必要ならJavaScriptで。 44
45. Mixer2の部分マーシャルの活用 45 Div div = html.getById(“foo”,Div.class); String str = m2Engine.saveToString(div); 1. 特定のタグ（ここではdiv）だけを文字列化 2. ほかのテンプレート形式に混ぜて出力可能 <%-- JSP --%> <html> <body> <%=str %> </body> </html> <html> <body> <div id=“foo”>.......</div> </body> </html>
46. 「選択肢のひとつ」としてのMixer2 46
47. ご静聴ありがとうございました！ http://mixer2.org/ 47