読者です 読者をやめる 読者になる 読者になる

GWTのパフォーマンス最適化機能(たくさんある中から3つ)

id:backpaper0 さんが GWTのパフォーマンス最適化の部分に触れていて、
セッションでは話したのですがスライドには書いてなかったので書いてみました。

話したのは、Deferred Binding, Image Bundle, Code Splitting です。



■ Deferred Binding
http://code.google.com/webtoolkit/doc/1.6/FAQ_Client.html#What_is_Deferred_Binding?

【超要約】
Deferred Binding は Java のリフレクションに対するGWTの答えです。
Webブラウザ毎の処理を書く事を考えた場合、Javaだと共通処理を親クラスで書いてブラウザ独自の処理はサブクラスを作ります。実行時に実行環境から適切なクラスをリフレクションを使って動的にロードして対応します。

GWTでも大体同じ様な仕組みですが、JavaScriptでは動的なクラスローディング(dynamic bindingともいう) はサポートされていないので、それぞれのブラウザ毎のJavaScriptの処理も生成します。でもOperaユーザがFireFox独自のJavaScriptファイルをダウンロードする必要があるでしょうか?

GWTではこれを Deferred Binding を使って解決します。動的なクラスローディングを実行時に行うのではなくてコンパイル時に行うとも言えます。GWTコンパイラはコンパイル時にブラウザ独自の処理(+各バージョン)をそれぞれ別々のファイルに分けて生成します。

ブラウザ独自の処理の検出だけではなく、国際化にも使えます。
英語圏の人がフランス語のメッセージが入ったファイルをダウンロードする必要があるでしょうか?

Deferred Binding は 動的バインディングとコンセプト的に大して変わりません。
ほとんど似ています。なのでGWTでは Java の Reflection の Class.forName("MyClass") の代わりに GWT.create(MyClass) のように使えば良いです。

See also
http://code.google.com/webtoolkit/doc/latest/DevGuideCodingBasics.html#DevGuideDeferredBinding



■ Image Bundle
http://www.infoq.com/articles/gwt-high-ajax

3.Bundle Your Images の【自分の解釈】
Image Bundle ではアプリケーションで使われている画像を一つのファイルにバンドルするので複数の画像があっても HTTPリクエストは1回でロードすることができます。

GWTコンパイラはインターフェイスが読み込まれている箇所をコンパイルし、画像リストを一つの画像ファイルとしてくっつけます。(それぞれの画像にはハッシュをファイル名として与えられます)



■ Code Splitting
http://code.google.com/webtoolkit/doc/latest/DevGuideCodeSplitting.html

Ajax アプリは JavaScript コードが大きくなりすぎてダウンロードされなかったりアプリケーションが始まるまでとても時間がかかっていました。
この問題を改善するために、GWT は Code Splitting(DFN code splitting) を提供しています。

[制限]
Code Splitting は一部のlinkerしかサポートされていません。デフォルトの frame linker はサポートしていますが、クロスサイトの linker はまだです。もしデフォルトでない linker を使用するよう変更をした場合は、その linker が Code Splitting をサポートしているか確認してください。

※使い方以降はリンク先を参照してください。