Top > 開発ガイド > コンポーネント開発逆引きリファレンス > JavaScriptのパフォーマンス低下を防ぐ(圧縮)

JavaScriptのパフォーマンス低下を防ぐ(圧縮)

対象バージョン

当ドキュメントはRubricks-0.6.x向けです。

概要

Rubricksでは多くのJavaScriptを利用しています。
JavaScriptの圧縮(空白除去や変数名の短縮など)を行うことで、パフォーマンスの低下を抑制します。

使い方

1. _preload.rhtmlから静的ロジックを切り出します。

 ▼切り出し前▼

_preload.rhml

<script type="text/javascript">
  rubricks.sample = {
    delete_id_list:null,
    delete_confirm: function(delete_id_list) {
      if(delete_id_list.length == 0) {
        rubricks.common.rubricks_message_window_open("<%= hl('[_Common_Error]') %>", 'error');
      } else {
        rubricks.sample.delete_id_list = delete_id_list;
        <%= render_confirm_window('[_Common_Delete_Confirm]', "rubricks.sample.delete(rubricks.sample.delete_id_list.join(','));") %>
      }
    },
    show: function() {
      new Ajax.Updater(
        'sample_detail_area',
        '<%= url_for(:controller => '/sample/index', :action => 'show') %>',
        {
          asynchronous:true,
          evalScripts:true,
          parameters:params,
          onLoaded:function(request){rubricks.common.rubricks_wait_message_close();},
          onLoading:function(request){rubricks.common.rubricks_wait_message_open();}
        }
      );
    }
  }
</script>

 ▼切り出し後▼

_preload.rhtml

<%= javascript_include_tag '/javascripts/components/sample/sample' %>
<script type="text/javascript">
  Object.extend(rubricks.sample, {
    err_delete_target_not_selected: "<%= hl('[_Common_Error]') %>";
    msg_delete_confirm:             "<%= hl('[_Common_Delete_Confirm]') %>",
    url_show:                       "<%= url_for(:controller => '/sample/index', :action => 'show') %>"
  });
</script>

src_sample.js(※src_xxx.jsと命名してください)

rubricks.sample = {
  delete_id_list:null,
  delete_confirm: function(delete_id_list) {
    if(delete_id_list.length == 0) {
      rubricks.common.rubricks_message_window_open(rubricks.sample.err_delete_target_not_selected, 'error');
    } else {
      rubricks.sample.delete_id_list = delete_id_list;
      rubricks.common.rubricks_confirm_window_open(
        rubricks.sample.msg_delete_confirm,
        function() {rubricks.sample.delete(rubricks.sample.delete_id_list.join(','));},
        Prototype.emptyFunction
      );
    }
  },
  show: function() {
    new Ajax.Updater(
      'sample_detail_area',
      this.url_show,
      {
        asynchronous:true,
        evalScripts:true,
        parameters:params,
        onLoaded:function(request){rubricks.common.rubricks_wait_message_close();},
        onLoading:function(request){rubricks.common.rubricks_wait_message_open();}
      }
    );
  }
}

2. svn://dev.rubricks.org/var/svn/rubricks/toolsから、圧縮ツールをチェックアウトします。

3. 圧縮ツールを下記のように配置します。

└rubricks_core
└tools
  └archive.rb
  └compress_util.rb
  └custom_rhino.jar

4. tools/archive.rbを環境に合わせて編集します。

…
//Rubricksのディレクトリ名を指定する(デフォルトは'rubricks_core')
rubricks_base   = File.join(current, '..', 'rubricks_core')
…

5. archive.rbを実行します。

  圧縮対象は、下記のパスに該当するファイルとなります。

  rubricks_core/components/*/_install/javascripts/src_*.js

  圧縮されたJavaScriptファイルは、下記のパスに格納されます(ファイル名はsrc_*.jsから「src_」を除去したものになります)。

  rubricks_core/components/*/_install/javascripts/*.js

> ruby archive.rb

関連項目