SHOEISHA iD

※旧SEメンバーシップ会員の方は、同じ登録情報(メールアドレス&パスワード)でログインいただけます

CodeZine編集部では、現場で活躍するデベロッパーをスターにするためのカンファレンス「Developers Summit」や、エンジニアの生きざまをブーストするためのイベント「Developers Boost」など、さまざまなカンファレンスを企画・運営しています。

「Dojo道場」~実用アプリ構築のためのベストプラクティス

Dojo道場 ~ 第4回「ビルドでパフォーマンス・チューニング(2)」
高度なチューニング・テクニック

「Dojo道場」~実用アプリ構築のためのベストプラクティス


  • X ポスト
  • このエントリーをはてなブックマークに追加

baseモジュールのスリム化

 通常のアプリケーション開発ではあまり行うことはありませんが、モバイル向けアプリケーションや遅い回線のサポートでパフォーマンスに対する要求が非常に厳しい場合など、ぎりぎりまでコード・サイズを切り詰めたい場合には、baseモジュールのスリム化を検討する余地があります。

baseモジュールとは

 dojoおよびdijitには、baseモジュールと呼ばれる次に示すようないくつかのモジュールが存在し、それぞれdojo/_base、dijit/_baseフォルダに配置されています。

  • dojo/_base

    Color.js Deferred.js NodeList.js _loader/ array.js browser.js connect.js declare.js event.js fx.js html.js json.js lang.js query-sizzle.js query.js window.js xhr.js

  • dijit/_base

    focus.js manager.js place.js popup.js scroll.js sniff.js typematic.js wai.js window.js

 これらのbaseモジュールは、明示的なdojo.requireなしに常に利用可能なモジュールという位置付けです。dojo.forEach()やdojo.query()といった便利な機能がdojo.requireなしに使えるのはそれらがbaseモジュールで定義されているためです。

 逆に言うと、アプリケーション・コードから実際に使われるかどうかにかかわらず、無条件に常にダウンロードされてしまうモジュールでもあります。アプリケーションによっては(特にdojoの標準ウィジェットを多用した場合など)結果的にほとんどすべてのbaseモジュールが実際に使われることとなり、スリム化の余地はないかもしれません。しかし、例えばカスタム・ウィジェットが中心のアプリケーションなどでは、もし使っていないbaseモジュールがあればそれらをビルドから外すことでコード・サイズを減らすことができる場合があります。

dojo baseモジュールのスリム化

 ビルドを行うと、すべてのdojo baseモジュールはdojo.jsレイヤーに自動的に取り込まれます。これを取り込まれないようにするには、リスト3のようにcustomBase: trueを指定します。指定すると、今度はすべてのdojo baseモジュールが取り込まれなくなりますので、実際に必要なdojo baseモジュールはdependencies配列に明示的に列挙します。

リスト3. customBaseの使用例
dependencies = {
    layers: [
        {
            name: "dojo.js",
            customBase: true,
            dependencies: [
                "dojo._base.declare",
                "dojo._base.lang",
                "dojo._base.array",
                "dojo._base.window",
                "dojo._base.event",
                "dojo._base.connect",
                "dojo._base.html",
                "dojo.parser",
                "dijit._Widget"
            ]
        },
        ....

 ただし、ビルド・ツールに不具合があり、場合によってはプロファイルで明示的に指定したもの以外のbaseモジュールを取り込んでしまう場合があります。release/dojo/dojo/build.txtを確認し、もし問題がある場合はutil/buildscripts/jslib/buildUtil.jsからリスト4のようなコードを探し、while文にfalse&&を書き加えてそこで行われているパターン・マッチング処理を無効にしてみてください。

リスト4. util/buildscripts/jslib/buildUtil.jsへのパッチ
var addedResources = {};
while(false&&(matches = buildUtil.baseMappingRegExp.exec(tempContents))){
    var baseResource = buildUtil.baseMappings[matches[1]];
    //Make sure we do not add the dependency to its source resource.

dijit baseモジュールのスリム化

 dijit baseモジュールは、すべてのdojoウィジェットのベース・クラスである_Widget.jsが依存しています。すなわち、ビルド時に依存関係に_Widget.jsが含まれていれば、自動的にすべてのdijit baseモジュールが取り込まれます。ビルド時にこの_Widget.jsからdijit baseモジュールへの依存関係を断ち切るには、次の例のようにビルドのコマンドライン・オプションでcustomDijitBase=trueを指定します。

> build profile=cal action=release customDijitBase=true

 コマンドライン・オプションの指定により、今度はすべてのdijit baseモジュールが取り込まれなくなりますので、実際に必要なdijit baseモジュールはdependencies配列に明示的に列挙します。

リスト5. customDijitBase指定時のプロファイル例
dependencies = {
    layers: [
        ....
        {
            name: "../acme/widget/myCalendar.js",
            dependencies: [
                "dijit._Widget",
                "dijit._base.manager",
                "acme.widget.myCalendar",
                "acme.data.myDataStore"
            ]
        },
        ....

 画面にHello worldと表示するだけの最もシンプルなカスタムdojoウィジェットを実行するのに必要なdijit baseモジュールはdijit._base.managerだけです。従って、customDijitBaseオプションを使用する場合は、dijit._base.managerだけは無条件に依存関係に含めるようにし、それ以外は必要に応じて指定します。

次のページ
条件付きコンパイル

この記事は参考になりましたか?

  • X ポスト
  • このエントリーをはてなブックマークに追加
「Dojo道場」~実用アプリ構築のためのベストプラクティス連載記事一覧

もっと読む

この記事の著者

神山 淑朗(カミヤマ ヨシロウ)

日本アイ・ビー・エム株式会社 ソフトウェア開発研究所に勤務。現在は主にdojoベースのwebアプリケーションの研究開発に従事。

※プロフィールは、執筆時点、または直近の記事の寄稿時点での内容です

この記事は参考になりましたか?

この記事をシェア

  • X ポスト
  • このエントリーをはてなブックマークに追加
CodeZine(コードジン)
https://codezine.jp/article/detail/5694 2012/01/30 11:50

おすすめ

アクセスランキング

アクセスランキング

イベント

CodeZine編集部では、現場で活躍するデベロッパーをスターにするためのカンファレンス「Developers Summit」や、エンジニアの生きざまをブーストするためのイベント「Developers Boost」など、さまざまなカンファレンスを企画・運営しています。

新規会員登録無料のご案内

  • ・全ての過去記事が閲覧できます
  • ・会員限定メルマガを受信できます

メールバックナンバー

アクセスランキング

アクセスランキング