Sencha Touch-ビルド

Webアプリケーションに対する今日の需要は、少ない開発労力で高速アプリケーションを開発することです。 Sencha Touchは、カスタムビルドを作成する機能に加えて、開発コードまたは実動コードに基づいて選択できる多数のビルドライブラリを提供するため、簡単にこれを行うことができます。

Sencha Touchビルドライブラリは、クラスを動的にロードします。動的ロードは、必要なときにロードされるクラスを表し、アプリケーションに必要なクラスのみが含まれます。これにより、ロードするファイルの数が減るにつれてアプリケーションの実行が高速になり、同時にロード時間が短縮されます。

Sencha Touch 2.xは、次の5つのビルドライブラリを提供します。

Sr.No.	Builds & Usage
1	sencha-touchdebug.js このビルドは、アプリケーションをローカルで開発するときに使用されます。開発中に簡単にデバッグできるように、すべてのコメントとデバッグログを備えた縮小されていないバージョンです。
2	senchatouch.js このファイルは本番目的で使用されます。これは、カスタムビルドがある場合の縮小バージョンです。
3	sencha-touchall.js このファイルは本番目的で使用されます。カスタムビルドがない場合は縮小版です。
4	sencha-touchall-debug.js このファイルは、実稼働環境でのデバッグに使用されます。縮小されておらず、すべてのコメントとデバッグログがあります。
5	sencha-touchall-compat.js このビルドは、バージョン1.xをバージョン2.xに移行するために使用されます。バージョン1.xのコードに互換性がなく、コードの変更が必要な場合は、警告が表示されます。

上記のビルドにより、Sencha Touchはカスタムビルドを作成する機能を提供します。

カスタムビルドを使用する利点

カスタムビルドは、すべてのタッチファイルをロードしません。アプリケーションで使用しているファイルのみをロードするため、アプリケーションの高速化とメンテナンスが容易になります。

Sencha CMDは、カスタムビルドの作成に使用されます。 Sencha CMDでカスタムビルドを作成するには、アプリファイルが存在するディレクトリに移動し、次のコマンドのいずれかを入力してビルドを作成します。

Sr.No.

Command & Usage

1

sencha app build native

アプリケーションをビルドし、アプリケーションのパッケージ化に使用できるpackager.temp.jsonというファイルを準備します。packager.temp.jsonはpackager.jsonと同じですが、追加のパスが含まれています。

2

sencha app build -run native

アプリケーションをビルドして自動的にパッケージ化し、適切なシミュレーターを起動します。

3

sencha app build package

パッケージ化サポートを使用してアプリをビルドしますが、パッケージャーJSONファイルを構成しません。これは、複数のpackager.jsonファイルを手動で管理するプロジェクトに役立ちます。

ビルドが成功すると、all-classes.jsファイルが生成されます。これをindexlに含めて、本番環境で使用できるようにする必要があります。

次のコードは、生産準備完了コードに対して行う変更を示しています。

アプリケーションを構築する前のインデクセル

<!DOCTYPE html>
<html>
   <head>
      <link href = "https://cdn.sencha.com/touch/sencha-touch-2.4.2/resources/css/sencha-touch.css" rel = "stylesheet"/>
      <script type = "text/javascript" src = "https://cdn.sencha.com/touch/sencha-touch-2.4.2/sencha-touch-debug.js"></script>
      <script type = "text/javascript" src = "app.js"> </script>
   </head>
   <body>
   </body>
</html>

アプリケーション構築後のインデクス

<!DOCTYPE html>
<html>
   <head>
      <link href = "https://cdn.sencha.com/touch/sencha-touch-2.4.2/resources/css/sencha-touch.css" rel = "stylesheet"/>
      <script type = "text/javascript" src = "https://cdn.sencha.com/touch/sencha-touch-2.4.2/sencha-touch.js"></script>
      <script type = "text/javascript" src = "app.js"> </script>
      <script type = "text/javascript" src = "app-classes.js"> </script>
   </head>
   <body>
   </body>
</html>

Sencha-touch-build-application

Sencha Touch-ビルド

カスタムビルドを使用する利点