Ionic-framework: 初期読み込みを高速化

こんにちは@dheran 。 起動時間は、私たちが話しているように短縮するために懸命に取り組んでいます（：。現在、Ionicアプリを大幅に小さくし、オフラインテンプレートのコンパイルを含む新しいビルドチェーンに取り組んでいます。これら2つの改善により、次のことが期待できます。起動時間が大幅に改善されました。StackOverflowまたはフォーラム（forum.ionicframework.com）で、ネイティブアプリ内のWebビューを「プリロード」する方法を尋ねます。Ionicをご利用いただきありがとうございます。

@ jgw96ねえ、既存の機能のリクエストや問題はありますか？ 実装後のフォローアップや使用が簡単になるように。

@dheranいい質問です！ これは非常に初期の段階であるため、現時点ではこれに関する適切な追跡の問題はありませんが、これは私たちにとって優先度が高く、ionic-cliチームはこれについて多くの良い進歩を遂げています。 これがさらに進んだら、私はこの問題を進捗状況で更新しようとしますので、あなたは何を期待するかを知っています（：

@ jgw96では、なぜそれを開いたままにしないのですか？

@ jgw96ビルドプロセス中に未使用のcssを削除することも大いに貢献します

ionic2を使用してモバイルWebサイトを構築しましたが、Android 4.4ブラウザーを使用して開くと、非常に遅いことがわかりました。 私に何か良い提案がありますか？
ウェブサイト： https ：

コルドバCLI：6.1.1
Ionic Frameworkバージョン：2.0.0-beta.6
Ionic CLIバージョン：2.0.0-beta.31
Ionic App Libバージョン：2.0.0-beta.17
ios-deployバージョン：1.8.5
ios-simバージョン：5.0.6
OS：Mac OS X El Capitan
ノードバージョン：v5.3.0
Xcodeバージョン：Xcode7.2ビルドバージョン7C68

@ jgw96どのバージョンがこの機能を取得するかについて何か考えはありますか？

ねえ@dheran ！ 良い質問！ 数日前の時点で、webpack 2を使用したツリーシェイクの実装が機能しており、オフラインコンパイラの使用に取り組んでいます。 今日Angularチームのミーティングノートを読んだ後、Angular 2 rc 4までオフラインテンプレートコンパイラを「安定」と呼ぶつもりはないようですが、それまでにオフラインコンパイラの実装ができることを願っています。

@ jgw96彼らはすでに問題を解決しているようです。 https://github.com/angular/angular/issues/3605
Angular RC 4はほぼ33％完了しています（マイルストーンで）。
イオンベータ10または11の新しいコンパイラを期待できますか？

こんにちは@dheran 、私たちは積極的に取り組んでいます。 これは私たちにとって非常に優先度の高いアイテムですので、できるだけ早く完了することをご承知おきください。

ありがとう、
ダン

@danbucholtzは、公式の解決策が来るまでの初期レンダリング時間を短縮するための一時的な回避策を提案していただけますか。 なぜなら、この問題を修正するか、ネイティブコードで同じものを削除してビルドするかの2つの選択肢が与えられたからです。

こんにちは@dheran 、

申し訳ありませんが、現時点では回避策を提供していません😄ベータ段階であり、Angularがオフラインテンプレートのコンパイルとミニファイを良好な状態にするのを待っていることを忘れないでください。彼らがしていることを模倣します。 これは、ビルドプロセスをできるだけ早く開始するために非常に重要ですが、まだ準備ができていません。

ありがとう、
ダン

+1

rc4まで待つことはできますが、オフラインテンプレートのコンパイルを優先してください。 参考までに、私たちのアプリの初期時間は約8秒ですが、他のネイティブアプリの初期時間は約1〜4秒です。 本当に初期時間を短縮する必要があります。

最後に、作業に感謝します。

@grapemixその間違いなく優先度が高いです！ 私たちは常にAngularチームと協力して、オフラインテンプレートのコンパイルをIonicと連携させ、ツリーの揺れと積極的な縮小を行って、アプリの平均サイズを大幅に小さくすることができます。 上で述べたように、私たちが今待っているAngularへのいくつかの変更がありますが、それは間違いなく完了します（：

+1

+1

@ jgw96 @danbucholtzみんなこれで何か進歩はありますか？ ベータ11で修正できますか？

+1

これを追跡しているのはどのリポジトリですか
私はwebpackに関して少し助けることができると思います

@prijindal 、

@ jthoms1がこのブランチで作業を行っていると思います。
https://github.com/driftyco/ionic/tree/adding-offline-template-compiling

ありがとう、
ダン

こんにちは@ jthoms1 、変更はベータ11の前にマスターとマージされますか？

ええ、私もオフラインでコンパイルするのを待っていますが、今何かを作ることができます。
私たちのサイトは完全にIonic2beta.8にあります
http://m.sherpadesk.com/

私もハイブリッドアプリを持っていて、いくつかの最適化を行い、 417msの読み込み時間を取得し
レポートhttps://tools.pingdom.com/#!/DW6Td/http://m.sherpadesk.com/17を見てください
また、サイトサイズは600％減少しました
ユーザーインタラクションの応答速度が2000％向上しました

良い推奨事項： http ：

すべてのgulp設定とappstoreへのリンクをここに投稿します： http ：

@Evgeniynetとてもいいです。

いくつかの質問：

1. アプリをインストールするとすぐに開きますが、。 プロファイルを読み込んでいますが、5秒間スタックしているようです。 どうして？
2. オフラインでコンパイルせずに読み込み時間を最適化するにはどうすればよいですか？
3. あなたのモバイルウェブサイトはionic2ですか？
4. デスクトップWebサイトはionic2ですか？

私はionic2の使用を考えていますが、webappプロジェクトとmobileionic2プロジェクトを管理する必要があるのを止めている唯一のことです。

ありがとう

@evgeniynetはノードによって提供されますか？
コンパイル済みのようです。 しかし、私たちの場合のほとんどは、デバイスストレージホスティング（phonegapアプリケーション）になります。

@dheran 、いいえ、Azure Webサイトでホストされています。これは、ionic 2gulpビルドタスクによって生成されたプレーンなhtmlファイルとjsファイルのみです。

@ justme1

1. ええ、私はhttp://www.bennadel.com/blog/3105-creating-a-pre-bootstrap-loading-screen-in-angular-2-rc-1.htmでトリックをしました

あなたのモバイルウェブサイトはionic2ですか？
はい

デスクトップWebサイトはionic2ですか？
はい

私のiOSアプリは、ウェブビューにサイトをロードするだけで、それ以上のものはありません。

iOS、Android、Windows Phone、Webアプリ、Chrome拡張機能、さらにはAppleiWatch用のコードベースは1つだけです。

ギャップ：//エラーを防ぐために、cordovaのロードを停止する特別なフラグを設定しました

私はこれに関する完全なガイドをhttp://www.sherpadesk.com/blog/に書いてい

@evgeniynet

1. これが事実である場合、それは実際には速くロードされていないようです:-)

1つのコードベースについて：

私が理解したところによると、ionic2はブラウザで完全にサポートされているため、デスクトップWebサイトとして使用することは想定されていません。 この問題を気にしませんか？

この機能を待つことを期待してください。

こんにちは、これに関する更新はありますか？
私はバージョンを使用しています：
コルドバCLI：6.3.0
Ionic Frameworkバージョン：2.0.0-beta.10
Ionic CLIバージョン：2.0.0-beta.35
Ionic App Libバージョン：2.0.0-beta.19
LG Nexus 5（os 6.0）
サイドメニューチュートリアルアプリv1が3秒で読み込まれます
--v2サイドメニューが6秒で読み込まれます

事前コンパイル機能はベータ12で提供されます。これにより、初期ロードが劇的に高速化され、バンドルのサイズが大幅に削減されます。 Beta 11をリリースしようとしているので、次はこれです。 これが私たちの最優先事項です。 ブランチで作業しているので、間近です。

ありがとう、
ダン

初めて本当に遅いです。 最適化を待っています

@danbucholtzまたは誰かがこの問題をベータ12マイルストーンに追加します

@danbucholtzブランチコードを使用できますか？ 申し訳ありませんが、ベータ12のリリースまで待つことはできません.. :-(
クイックリリースをお願いします。

@dheran 、

この変更には、まだリリースされていないAngular RC5が必要です。 ベータ12の準備が整い次第リリースします。 準備が整うまでリリースしません。

短期的な解決策としては、以下に示すようにインラインテンプレートを使用するように切り替えることが考えられます。 これは短期的にはより速くなります。 それを試してみて、それがあなたのために物事をスピードアップするかどうかを確認してください。

@Component({
   template: `
   <ion-content>
      <div>content</div>
   </ion-content>
  `
})
export MyClass {
}

ありがとう、
ダン

@danbucholtzインラインは実際に大いに役立ちます。
ビルド中にそれを行う小さなコードをgulpfile.jsに記述しました。

gulp.task('build', ['build:prequel'], function(done) {
  glob('./www/build/**/*.html', function(e,files) {
    var indexPath = './www/build/js/app.bundle.js'
    var js = fs.readFileSync(indexPath, 'utf8');

    async.eachSeries(files, function(file, callback) {
      filename = file.substr(6)
      var html = fs.readFileSync(file, 'utf8');
      js = js.replace("templateUrl: '" + filename + "'", "template: `" + html +"`")
      callback()
    }, function() {
      fs.writeFile(indexPath, js, 'utf8', function(err, data) {
        done()
      });
    })
  })
})

ええ、これはきれいではなく、そうするための最良の方法ではありません。
しかし、それは魅力のように機能します。

PS：インライン化は、最初の起動ではあまり役に立ちません。おそらく最大0.5秒です。 ただし、ページ遷移間やコンポーネントを動的にロードするときはいつでもスムーズになります。

@prijindal 、いいね！ すごい！ ベータ12で提供されるAoTコンパイラでは、テンプレートがインラインであるか外部ファイルであるかは関係ありません。 ビルドプロセスの一部として純粋なJSに変換されます。 それを理解する素晴らしい仕事！

ありがとう、
ダン

こんにちは、Angularページを確認しましたが、RC5がリリースされていることがわかりました。 「rc5が出るまで」とはどういう意味ですか？

@ kLkA 、 @ dheran Ionicチームに休憩を与えてください-彼らは確かにできるだけ早くベータ版を出そうとしているので、毎日pingを実行しても何の役にも立ちません。 彼らはAngularでGoogleと直接連携しており、Angular2rc5がリリースされたことを確実に知っているはずです。

ええとグーグルはほんの数時間前のようにrc5をリリースしました。
彼らはリリースを認識していて、ベータ12に移行するために何かを取り組んでいると確信しています

@astec本当に？ あなたが私たちの立場にいないことを願っています。
この問題により、私たちはライブに移行できません。 あなたはこの立場にいますか？
私のコメントを注意深く読んだら。 私はIonicチームに、AoTパッチと他の優先度の低いバグ修正の代わりにクイックリリースとしてAoTパッチ（danbucholtzは別のブランチで行われたと言っています）をリリースできるかどうか尋ねました。 これがあなたにとって優先事項ではなく、私たちのコメントがあなたをスパムしていた場合は、購読を解除することをお勧めします。

@dheran 、私は初期のベータ版であなたの立場にあり、

これはあなたのニーズや経験を投稿することについてのスレッドではありません。 トピックに固執するか、そのままにしてください。 👍

ionic2beta12を楽しみにしています。 すべての最高のチーム:)

ねえ@dheran！ 申し訳ありませんが、間違いなくあなたの不満を感じています。私たちはこれを機能させるためにできる限り努力してきました。私たちは今非常に接近しており、他のいくつかの重大なバグとともにbeta.12リリースになると喜んで言うことができます修正。 これをもっと早く出したかったのですが、過去数週間、angularを使用して、aotコンパイルが機能しない原因となっていたいくつかのバグを修正してきました。 また、最初にIonicを新しいaotコンパイル用に最適化し、次にAngular 2RC5での作業に必要なすべての変更を行うのにも時間がかかりました。 上記のdanのブランチを使用することをお勧めできない理由は、実際にアプリをビルドするためのgulpタスクがまだ完全に完了していないためです。 したがって、技術的にはそれを使用できますが、実際にはアプリを構築することはできません。 Angular 2 rc5のプレリリースバージョンでしばらく作業してきましたが、それを含むリリースを快適に行えるようになる前に、他の人と同じようにそのリリースが公開されるのを待つ必要があります。 私たちはまだベータ版です。つまり、作業が進行中であり、変更される予定です。これは、ベータ版ソフトウェアに関してはゲームの名前にすぎません。 最後に、コミュニティの他の人と交流するときは、私たちの行動規範を念頭に置いていただけませんか。 Ionicをご利用いただきありがとうございます。 また、何が機能しているかを確認したい場合は、ミーティングノート（Twitterでも共有されます）とロードマップを確認してください。

よくわかりませんが、イオンの高速化の主な進歩は

良い場所@msaelices ！ 実際、これのフレームワーク側のほとんどは、現時点ではhttps://github.com/driftyco/ionic/commits/deeplinks-ngmoduleで実行されてい

私にとっての問題は、（ブートストラップ中のように）最初の読み込みではなく、ユーザーがアクセスしていないページにアクセスするたびに発生します。

このAoTコンパイラがionicになるのを待っている間に、すべてのコンポーネント（任意の@Component ）を取得するTemplatePrecompilerという_splash_画面（アプリのロゴが付いたionicページ）を追加しました。私のアプリの@Componentは、それがIonicページであるかコンポーネントであるかに関係なく）、実行時に1つずつコンパイルします。 それが終わったら、私はホームページに転送します。
これは非常に便利です。ユーザーにはしばらく時間がかかるスプラッシュ画面（私のアプリでは最大5秒）が表示されますが、すべてが読み込まれると、すべての画面が高速になります。 また、そのスプラッシュ画面にプログレスバーを配置することもできます。

ここで要点を作成しました： https ：

皆様に最新情報をお届けするために、積極的に取り組んでいます。 予想以上に大変な努力でしたが、前進し、近づいています。 AoTに必要なすべての変更を含むマスターよりも約200コミット先のブランチがあります😄

これはすぐに来るでしょう。 これを社内でテストし始めているところです。 まだ公開テストの準備ができていません。 これは私たちの最優先事項であり、フレームワークチーム全体がこの取り組みを正しく行うために懸命に取り組んでいます。 まだタイムラインはありませんが、私たちはそこに到達していると言うことができます。私はこのスレッドを新しい情報で更新し続けます。

ありがとう、
ダン

+1

そして私のapp.bundle.jsは3.8MBです...

+1
何時にbeta12をリリースしますか？ @danbucholtz

テンプレートをコンポーネントに配置する
このアプローチを試しました。テンプレートをフェッチするためのHTTPリクエストの時間を節約できますが、最初のビューの読み込みにはまだラグがあります。 これは、Angularが最初のビューの読み込み時にテンプレートのカスタムhtmlをコンパイルするために発生すると思います。

私はAngularにまったく慣れていないので、誰かが私にこれを明確にしてくれれば幸いです。

@moatazel​​gamal 、

AoTコンパイルにより、大幅なスピードアップが実現します。 一般的なアプリのコンパイラーを事前に実行するのに数秒かかるため、これは実行時から短縮された時間です。 典型的なアプリでどれだけ速くなるかはわかりません。 非常に基本的なサンプルでのみテストし、起動時間は約3秒から約300ミリ秒になりました。 一般的なアプリでどのような数値が表示されるかを知るのに十分なテストは行っていませんが、間違いなく高速になります。

AoTの変更はフレームワークに適用されており（私たちは...これまでのところ良いと思います😄）、現在、ビルドプロセスをA）シンプル、B）スケーラブル、C）できるだけ速くすることに移行しています。 チームと私はこのリポジトリで一緒に取り組んでいます。

もっと早く聞くことを期待してください。

ありがとう、
ダン

@moatazel​​gamal私のアプローチはオフラインコンパイルではなく、単にテンプレートをインライン化することです。
オフラインコンパイルにより、初期ロードが大幅に高速化されます。

全て、

現在、これを社内で徹底的にテストしています。 今週は大きな進歩を遂げました。

ありがとう、
ダン

こんにちは、
Ionic2 RC0がリリースされたようですが、これは予想されるbeta12ですか？ RC0の変更ログには、AOTコンパイルについては何も記載されていません。 この機能は、変更ログで見逃すにはあまりにも優れていると思います:)

「リリース」されました。 現在もギャップを埋めています😄変更ログなどで。今日の後半に公式の詳細を期待してください。 昨日技術的な問題が発生したため、少し遅れています。

ありがとう、
ダン

こんにちはイオンチーム！ 頑張ってくれてありがとう！

これにとても興奮しています。 私が最初にそれについて読んだので、つぶやきを止めることはできません。
賞賛のイオンチーム。

木、2016年9月29日には、午前4時19分gisinactionの[email protected]は書きました：

こんにちはイオンチーム！ 頑張ってくれてありがとう！

—
このスレッドにサブスクライブしているため、これを受け取っています。
このメールに直接返信し、GitHubで表示してください
https://github.com/driftyco/ionic/issues/6776#issuecomment -250346182、
またはスレッドをミュートします
https://github.com/notifications/unsubscribe-auth/AAxEjznTYrcKZKFD2rElIqKkWrGIvvUrks5quxIvgaJpZM4Iuokt
。

まず第一に、この大きな進歩に感謝します！
私は新しいバージョンをテストしてきましたが、最初の読み込みが速く感じられるようになりました。

また、パフォーマンスの違いをよりよく感じてIonic 1と比較するために、低スペックのAndroid4.4.4でテストしています。
Ionic 2-rc0を使用すると、次のようなおおよその結果が得られます。

| プロジェクト| コールドブート| ホットブート|
| --- | --- | --- |
| ionic1-tabs | 4,5秒| 3秒|
| ionic2-tabs | 5秒| 3,5秒|
| ionic1-サイドメニュー| 5秒| 3,5秒|
| ionic2-サイドメニュー| 5秒| 3,5秒|
| 時計（ネイティブアプリ）| 1秒| <1秒|

• これらのコマンドで作成されたプロジェクト：

ionic start myTabs1 tabs
ionic start myTabs2 tabs --v2
ionic start mySidemenu1 sidemenu
ionic start mySidemenu2 sidemenu --v2

プロジェクトはまったく同じ実装ではありませんが、比較の出発点になります。

イオン性2-rc0を使用した場合でも、基本的なプロジェクトでは、コールドでロードするのに約5秒かかり、以前にロードした場合は約3.5秒かかります。 これらは、Ionic1バージョンで見つけた時間とほぼ同じです。
Ionic2 RC0を紹介するブログ投稿には、現在のロードアップ時間を示すアニメーションGIFが含まれています。 約3秒。

残りの秒数はどこにあるかわかりますか？ （例：Javascriptエンジン/ウェブビューの起動、Cordovaプラグイン、Angular 2の読み込みなど）？

これらの秒数を最適化して、ネイティブアプリに近いエクスペリエンスを実現できますか？

@SynerG 、すばらしい情報。 私は今、他の何かに少し圧倒されていますが、すぐにもっとフィードバックがあります。 それをまとめてくれてありがとう！

ありがとう、
ダン

サイドメニュー付きの新しいionic2rc-0プロジェクトを作成しました。 ionicserve --labを使用しましたが、ヘッダーバーの左側にあるアイコンをクリックしてもメニューが表示されません。 スライドするか、スライドするメニューのボタンをクリックしたときのみ

@danbucholtz RC0をリリースしてくれたIonicチームに感謝したいと思います！ すべての変更により、アプリの移行に時間を費やす必要がありましたが、アプリの起動時間が大幅に改善されました。 たとえば、3年前のSamsung Galaxy 4では、ベータ11での起動時間は約6秒でしたが、RC0は約3秒に短縮されました。 それはとてもよくできた素晴らしい改善です:)

@ abhayastudios 、w00t！ ありがとう！

ストアにはさらに改善と最適化があります！

ありがとう、
ダン

私たちもロード時間を約50％短縮しました。 素晴らしい仕事の人。 このフレームワークでの作業は本当に大好きです。

私はこれが役に立たないことを知っていますが、私は最近ionicに飛び込み、2.0.0-rc.2を使用しています、1.1.1で構築されたアプリと比較して初期ロードがいかに遅いかに気づきました

@geocine同じことに気づきました。古いv1アプリでは、起動時間は非常に良好ですが、Ionic v2ははるかに優れたプログラミング環境を提供しますが、私のアプリでは起動時間が非常に遅くなります（リリースビルドでは比較的5秒以上） Android 6.0を搭載した高速デバイス）。 Webpackビルドはツリーシェイクを行っていますか？

ロードに本当に時間がかかる場合は、ロード中に1秒以内に表示できるスプラッシュスクリーンを少なくとも表示する方法はありますか？

@geocineそのため、通常はcordovaスプラッシュスクリーンプラグイン（https://github.com/apache/cordova-plugin-splashscreen）を使用し、DeviceReadyで非表示にします。

アプリの起動時間をプロファイリングする簡単な方法はありますか？ Chromeリモートデバッガーを使用してアプリのプロファイリングを行っていますが、アプリが初期化された後でのみアプリに接続でき（スタートアップのプロファイリングができません）、アプリを終了すると閉じてしまうため、アプリを再起動してプロファイリングできませんこの方法で起動します。

Androidでのアプリの起動時間（5秒以上）に問題があるため、これを求めています。
プレーンなIonic2チュートリアルアプリを使用しても、比較的パフォーマンスの高いデバイス（Sony Z3 Compact、6.0.1）では4〜5秒後に起動します。
それは本当に遅いです（いくつかのプラグインを備えた私の古いIonic 1アプリは起動するのに3秒もかかりません）。

Ionic 2アプリの起動時間を（大幅に）短縮する計画はありますか？
Ionic 2での開発は素晴らしいですが、そうでなければ別のフレームワークに切り替える必要があるのではないかと心配しています:-(

遅延読み込みのサポートを追加する計画はありますか。これは、初期読み込み時間を短縮するのにも役立つ可能性があります。 webpackを使用するAngularcliは遅延読み込みをサポートするようになり、AoTを使用すると、適切に設計されたAngularアプリで読み込み時間を大幅に短縮できます。 Ionicもwebpackを使用しているので、これはIonicでも実行できると思います。

遅延読み込みの緊急の必要性。

イオンチームミーティングのドキュメントによると、彼らはツリーシェイクで作業しているので、おそらくこれによりバンドルサイズが小さくなり、起動時間が少し短縮されます。

木の揺れは素晴らしいですが、それはそれだけのことしかできません。 遅延読み込みは重要な個別の懸念事項であり、他の問題（https://github.com/driftyco/ionic/issues/8102など）で見たコメントによると、これまでのところ、イオンチームはあまり関心を示していません。 ）。 残念ながら、多くの人は、モバイルアプリでも非常に役立つ可能性があるにもかかわらず、Webアプリでのみ役立つと考えているようです。

@ rob3cなど、

遅延読み込みは私たちが検討しているものであり、さらに調査したいと考えています。 今後数か月以内に、このトピックについてさらに多くのことを聞くことを期待してください。

ありがとう、
ダン

@danbucholtz 、
遅延読み込み以外に、起動時間を大幅に短縮できる他のソリューションを模索していますか？

現在、これが、新しいプロジェクトでIonic2を採用しない最大の理由です。
何が進行中であるかについての情報を私たちと共有できるかどうかはわかりません。
ありがとう！

これは一般的なJavaScriptの問題であり、ionicに固有のものではありません。 他のフレームワークがそれについて何をしているのかを見るのは興味深いことです。 たとえば、v8エンジンの「コードキャッシング」と呼ばれるものを使用して起動パフォーマンスを大幅に向上させる「競合」フレームワークのWebサイトの関連記事に出くわしました。

AoTのためにAngular2がモジュールに切り替えられた後、起動時間は大幅に悪化しました。 起動時間が長いという問題もあるNativeScriptでは、Angular 2（https://github.com/NativeScript/nativescript-cli/issues/371）がなくても問題ないようです。 6月に私のアプリは比較的速く起動していましたが、Ionic2が新しいバージョンのAngular2に切り替えた後、5秒以上かかり、本番環境では使用できなくなりました。 これを改善するために行われているAngular2の改善を知っていますか、それともツリーシェイクと遅延読み込みが唯一の方法ですか？

@Kobzol 、

それは奇妙なことですが、AoTは間違いなく起動時間を大幅に短縮します（通常、とにかく、エッジケースがあると確信しています）。

@SynerG 、

AoTを使用すると、起動時間がかなり速くなります。 AoTでテストしていたのは確かですか？ 私たちのバンドルサイズはまだ比較的大きいので、それを減らすように取り組んでいます。 たくさんの大きなライブラリをインポートしない限り、それは完全に巨大ではありません。 多くの場合、ネストされた依存関係が多数あるため、小さなライブラリが巨大になります。

ありがとう、
ダン

何か問題があるかどうかはわかりませんが、Webpackとロールアップの両方を使用してIonic 2チュートリアルスターターテンプレートのAOT prodビルドを実行しようとしましたが、デバイス（Androidを搭載したSony Z3 Compact）で起動するのに5秒以上かかります6.0.1）、古いIonic1アプリは3秒で起動します。
Angular 2がモジュールシステムに切り替えたとき、スタートアップは過去2か月で悪化しました（Angularの切り替え後に遅くなった私のnativescriptアプリでも同じことが起こりました）。 たぶん、遅延読み込みがそれを助けるかもしれません。

比較に使用できるベンチマーク番号はありますか？

5秒は私が見ているものと比較してそれほど悪くはありません。 タイムアウトしないように、config.xmlのタイムアウト制限を引き上げる必要がありました（デフォルトは20秒です！）。

しかし、それは遅い4.4デバイスの場合でした。 6.0を搭載したSonyXperia E5では、まだ10〜15秒です。

iPhone 7plusは2秒未満です。

バンドルの大きさはどれくらいですか？ サードパーティのライブラリをたくさん使用していますか？

ありがとう、
ダン

こんにちはダン！

クレイジーすぎることはないと思います。

webpackとAoTを使用したバンドルサイズは1.9MBです。

package.jsonのDeps

...
  "dependencies": {
    "@angular/common": "2.2.1",
    "@angular/compiler": "2.2.1",
    "@angular/compiler-cli": "2.2.1",
    "@angular/core": "2.2.1",
    "@angular/forms": "2.2.1",
    "@angular/http": "2.2.1",
    "@angular/platform-browser": "2.2.1",
    "@angular/platform-browser-dynamic": "2.2.1",
    "@angular/platform-server": "2.2.1",
    "@biesbjerg/ng2-translate-po-loader": "^0.1.3",
    "@ionic/app-scripts": "0.0.46",
    "@ionic/storage": "1.1.6",
    "@ngrx/core": "1.2.0",
    "@ngrx/effects": "2.0.0",
    "@ngrx/store": "2.2.1",
    "angular2-uuid": "1.1.0",
    "ionic-angular": "nightly",
    "ionic-native": "2.2.7",
    "ionicons": "3.0.0",
    "ng2-translate": "^4.1.0",
    "ngrx-store-freeze": "0.1.4",
    "ngrx-store-logger": "0.1.7",
    "pofile": "^1.0.2",
    "rxjs": "5.0.0-beta.12",
    "zone.js": "0.6.26"
  },
  "devDependencies": {
    "@biesbjerg/ng2-translate-extract": "^0.1.1",
    "@ionic/app-scripts": "0.0.46",
    "@types/cordova-plugin-media": "0.0.3",
    "del": "^2.2.2",
    "fs": "0.0.1-security",
    "path": "^0.12.7",
    "typescript": "2.0.10"
  },
  "cordovaPlugins": [
    "cordova-plugin-device",
    "cordova-plugin-console",
    "cordova-plugin-whitelist",
    "cordova-plugin-splashscreen",
    "cordova-plugin-statusbar",
    "ionic-plugin-keyboard",
    "cordova-plugin-globalization",
    "cordova-plugin-media",
    "cordova-plugin-file",
    "cordova-plugin-compat",
    {
      "locator": "https://github.com/EddyVerbruggen/cordova-plugin-backgroundaudio",
      "id": "nl.x-services.plugins.backgroundaudio"
    },
    "cordova-plugin-app-version",
    "cordova-plugin-x-socialsharing",
    {
      "locator": "https://github.com/biesbjerg/cordova-plugin-inapppurchase.git",
      "id": "cordova-plugin-inapppurchase"
    },
    {
      "locator": "https://github.com/driftyco/cordova-plugin-wkwebview-engine.git",
      "id": "cordova-plugin-wkwebview-engine"
    },
    "cordova-plugin-google-analytics",
    "cordova-sqlite-storage"
  ],
...

こんにちは、
自分の情報も起動時間と共有したいと思います。
実際、私は古いIonic V1をV2に入れています（すべてを最初から書き直しています）。

クロスウォークを使用する古いアプリケーションは、3〜4秒で起動します（デバイスによって異なります）。
新しいアプリケーションには6〜7秒かかります（7秒の可能性が高くなります）。

RC3とナイトリービルドを試しました（Ionic Frameworkバージョン：2.0.0-rc.3-201612021933）

Package.json:
{
  "name": "ionic-hello-world",
  "author": "Ionic Framework",
  "homepage": "http://ionicframework.com/",
  "private": true,
  "scripts": {
    "ionic:build": "ionic-app-scripts build",
    "ionic:serve": "ionic-app-scripts serve"
  },
  "dependencies": {
    "@angular/common": "2.2.1",
    "@angular/compiler": "2.2.1",
    "@angular/compiler-cli": "2.2.1",
    "@angular/core": "2.2.1",
    "@angular/forms": "2.2.1",
    "@angular/http": "2.2.1",
    "@angular/platform-browser": "2.2.1",
    "@angular/platform-browser-dynamic": "2.2.1",
    "@angular/platform-server": "2.2.1",
    "@ionic/storage": "1.1.6",
    "ionic-angular": "^2.0.0-rc.3-201612021933",
    "ionic-native": "2.2.3",
    "ionicons": "3.0.0",
    "moment": "2.15.1",
    "rxjs": "5.0.0-beta.12",
    "zone.js": "0.6.26"
  },
  "devDependencies": {
    "@ionic/app-scripts": "0.0.44",
    "typescript": "2.0.9",
    "webpack-bundle-analyzer": "^1.5.3"
  },
  "cordovaPlugins": [
    "cordova-plugin-whitelist",
    "cordova-plugin-statusbar",
    "cordova-plugin-console",
    "cordova-plugin-device",
    "cordova-plugin-splashscreen",
    "ionic-plugin-keyboard"
  ],
  "cordovaPlatforms": [],
  "description": "o2: An Ionic project"
}

私のアセットフォルダ（サードパーティのプラグイン/画像）は約2.14MBです。
私は6つの異なるサードパーティプラグイン（jQuery、moment、hammer、jquery 3.1、fullcalendar、svg-panzoom、fontawesome）を使用しています。

APK-サイズは：6.58 MB
このパッケージを解凍すると、15MBになります。

折りたたみ：

• 資産：10.1 MB
  -> www / assets：2.93 MB
  -> www / build：7.07 MB
  -> www / build / main.js：3.003 MB
  -> www / build / main.js.map：3.790 MB（これは本番環境で必要ですか？）
• 解像度：1.73 MB
• class.dex：3.07 MB
• resources.arsx：0.13 MB

Ionic-バージョン情報：

Your system information:
Cordova CLI: 6.4.0
Ionic Framework Version: 2.0.0-rc.3-201612021933
Ionic CLI Version: 2.1.13
Ionic App Lib Version: 2.1.7
Ionic App Scripts Version: 0.0.44
ios-deploy version: Not installed
ios-sim version: Not installed
OS: Windows 8.1
Node Version: v6.9.1
Xcode version: Not installed

@danbucholtz / @ jgw96が私の実際のプロジェクトを使用してこの問題をデバッグできれば、それを共有できれば

ご挨拶
Graphefruit

本番ビルドではソースマップを無効にする必要があると思います。 Angular CLiは最近、それを無効にするオプションを追加しましたhttps://github.com/angular/angular-cli/pull/3262

Graphefruitは、アプリのコンポーネントとディレクティブの数も共有できますか？

こんにちは@ naveedahmed1 、
さあ行こう：

• サービス：10
• パイプ：3
• ページ：〜49
• カスタム構成：1
• ディレクティブ：0（;））

ご挨拶
Graphefruit

@ naveedahmed1その問題は、ソースマップをインライン化しないことに関するものです。これは、おそらく本番環境では最善のアイデアではないことに同意します。 ただし、本番アセットの外部マップファイルは便利であり、デプロイされたファイルに小さなコメントを追加するだけです。 プロダクションビルド用の外部マップファイルを生成できるようにしたいと思います。

@ rob3c 、

構成可能になります。

ありがとう、
ダン

@danbucholtz 、起動時間の改善が本当に必要です。 Playストアからダウンロードしたionic-conference-appでさえ、Samsung Galaxy S4 Androidバージョン5.0.1では9〜10秒かかります。
これは私がダウンロードしたアプリです--- https：//play.google.com/store/apps/details？id = io.ionic.conferenceapp

数ページのアプリの起動時間は、同じ電話で約7〜8秒です。

だから私はDeveloper-Toolsを介して私をアタッチしようとしましたが、かなり良いタイムライン結果が得られました。
アタッチしているため、最初から追跡できませんでしたが、何が起こっているかがわかります。

コンパイルスクリプトには約500ミリ秒かかり、評価スクリプトには0ミリ秒から5000ミリ秒かかります。

必要に応じて@ danbucholtz @ jgw96このために保存されたタイムラインを送信できます。

どのようにしてこれをプロファイリングしましたか？ 完全に起動するまでアプリに接続できません。

ところで、それがあなたにとって良い結果であるかどうかはわかりませんが、残念ながら私のクライアントにとっては、5/6秒を超える起動時間は受け入れられません。

@Kobzolそれは良い結果ではありません。ページにも7秒が必要です。
私がしたこと：ページを開き、接続されているデバイスリストを確認し、アプリを初めて通常どおりに起動し、[インスペクター]スイッチを開いて[タイムライン]タブに移動します
今すぐアプリを閉じて、インスペクターがアプリを再起動し、インスペクトを押して、タイムラインタブのを超高速で記録ボタンを押します;）
アプリ起動時の最初の1〜2秒もアタッチできませんが、残りは少しスピーディーな指で可能です。

更新：Ionic1を使用すると、起動時間が3〜4秒になり、非常に許容範囲内でした。

AoT構築していますか？ それらの時間は遅いようです。

ありがとう、
ダン

@danbucholtz 、私の場合、Playストアからionic-conference-appをダウンロードしました。これは、AOTでコンパイルされることを確信しています。ここで、私のコメントを参照してください。

@savanvadalia 、

実際にはAoTがバンドルされていなかったため、Playストアから削除しました。 私たちの開発者は公開する前に間違いを犯しました。 間もなく新しいバージョンを再公開します。

最新バージョンのionicCLIとapp-scriptsをインストールできますか？

npm install -g ionic<strong i="9">@latest</strong>
npm install @ionic/app-scripts<strong i="10">@latest</strong>

そして、 ionic build android --prod --releaseますか？ これにより、最適化されたAPKを使用したAoTビルドが提供されます。 低速のデバイスでも、9秒よりもはるかに速く起動するはずです。

ありがとう、
ダン

@Danどのデバイスでこれをテストしていますか？ すべてのパッケージを更新しても、6秒未満になることはなく、ここで見たところ、他の人も同様の経験をしています。

誰かが最新のアプリスクリプトをインストールすることができましたか？

更新の問題：

最新のアプリスクリプトをインストールしようとすると、次のエラーが発生します:(以前にionic @latestをインストールしました）

C:\Users\graphefruit\Documents\o3>npm install @ionic/app-scripts<strong i="9">@latest</strong>
ionic-hello-world@ C:\Users\graphefruit\Documents\o3
`-- @ionic/[email protected]  invalid
  +-- [email protected]
  +-- [email protected]
  `-- [email protected]
    +-- [email protected]
    `-- [email protected]

npm WARN optional SKIPPING OPTIONAL DEPENDENCY: fsevents@^1.0.0 (node_modules\ch
okidar\node_modules\fsevents):
npm WARN notsup SKIPPING OPTIONAL DEPENDENCY: Unsupported platform for fsevents@
1.0.15: wanted {"os":"darwin","arch":"any"} (current: {"os":"win32","arch":"x64"
})

この後、同じエラーでionic start o4 --v2という完全に新しいプロジェクトを開始しました。

更新メカニズムを取得できない可能性があります- package.jsonに自分自身を取得する必要がありますか、それともnode_modulesフォルダーを削除する必要がありますか？
手動で設定したapp-scriptsを更新し、npm installを実行しようとしましたが、クラッシュしました。
package.jsonも0.47自動的に更新されませんでした

だから私は今0.0.45と--prod --releaseプロジェクトを構築します

_そして起動時間も7-8秒でした。 _

@danbucholtzどこかでngfactoryファイルを見たのを覚えているので、今までずっとAOTを使っていたと思います。 現在のバージョン0.0.46が私のためにまともな仕事をしていたので、私は現在、新しいapp-scriptバージョンに移行することにまだ少し抵抗があります。 しかしとにかく、私はあなたの言葉を受け入れて0.0.47に更新し、何が起こるかをあなたに知らせます。

サバン

@danbucholtz最新のionic-app-scriptsに更新し、このエラーを受け取り始めました（下のスクリーンショットを参照）。
また、リリースノートに記載されているアップグレード手順に厳密に従いました。

これを手伝ってもらえますか？

ありがとう
サバン

@graphefruit最新のionic-cliのインストールとプロジェクトレベルでのnpmパッケージのインストールに問題はありませんでした。 こちらのリリース手順に従っていることを願っています。 しかし、前述したように、別の実行時エラー「モジュール 'AppModule'によって宣言された予期しない値 'undefined'」が発生します。

また、 --prod --releaseを指定して0.0.45を実行しても効果はありません。 ダンはそれをバージョン0.0.47で0.0.47から実行するように依頼しました。それ以降は、これが本番ビルドを生成する方法になります。 以前のionic-app-scriptバージョンでは、 ionic run androidがデフォルトで本番ビルドを生成していました。

@savanvadaliaフィードバックをありがとうございます。手順にはあまり書かれていません。
私も新しいプロジェクトを開始し、以前はnpm install -g ionic@latestを実行しました。
では、プロジェクトフォルダで両方のコマンドを実行しただけですか？ それとも何か具体的なことをしましたか？
私が言ったように、私はすでにnode_modulesフォルダーも削除しようとし、その後npm-installた。
しかし、私の意見では、 package.jsonが最新のアプリスクリプトバージョンに更新されていない場合は役に立ちません。 0.47が、これを手動で行うと、さらにクラッシュします...

通常、彼らは最新のpackage.jsonと何を更新するかを変更ログに投稿します。

更新し、最終的に次のコマンドで解決するために管理しました。

npm install ionic-angular<strong i="18">@nightly</strong> --save
npm install @ionic/app-scripts<strong i="19">@latest</strong> --save-dev

ビルドを始めましょう。

ビルドテスト

それで、ビルドが完了しました。面白い事実です。ngc-startedが10分以上表示されたため、「strg + c」を実行する必要がありました。その後、ビルドが続行され、2回目は問題なく実行されました。

サイズ：9.2 MB
main.js.mapは、本番用にビルドするときにまだ存在しています

アプリの起動には7〜10秒かかります（デバイスによって異なります）ので、以前よりも悪化したようです。
（注1、注2）

Google Pixel XLでは、起動時間は約4.5〜5秒でした
私の古いアプリバージョンと比較すると、まだ1〜2秒遅い（起動時間3.5秒）

Your system information:

Cordova CLI: 6.4.0
Ionic Framework Version: 2.0.0-rc.3-201612142137
Ionic CLI Version: 2.1.17
Ionic App Lib Version: 2.1.7
Ionic App Scripts Version: 0.0.47
ios-deploy version: Not installed
ios-sim version: Not installed
OS: Windows 8.1
Node Version: v6.9.1
Xcode version: Not installed

アップデート2：

古いビルドのサイズを0.45と0.47で比較しました。main.jsのサイズは（ほぼ10kb）同じで、3MBです。 -これも影響を受けるべきかどうかわからない。

Update3：

これは、15分後にロードを試みた後の最良のスナップショットです。

@danbucholtzランタイムエラーを自分で解決することができました。これは、角度のあるバレルに関連していました。 app.module.tsファイル内の完全なパスでモジュールを参照する必要がありました。 しかし、新しいスクリプトバージョンで失敗し始めた理由はわかりません!!

ただし、エラーを修正し、Samsung Galaxy S4 Androidバージョン5.0.1でionic run android --prod --releaseを実行した後でも、初期ロードは7〜8秒です。 最新のionic-app-scriptsバージョンに更新した後、イニシャルに変更はありません。

私たちは本当に最初のロード時間を改善する必要があります。 個人的には、使用している携帯電話とAndroidのバージョンが比較的古く、起動時間がそれほど遅いとは思いません。 旧中型電話での起動時間は3〜4秒の間でよかったと思います。

@graphefruit 、リリース手順に記載されていない2つの手順を実行しました
1）package.jsonファイルを手動で変更してスクリプトバージョンを0.0.47から、npminstallを実行しました。
2）リリースノートに従って、新しいビルドプロセスでは無効な.tmpディレクトリも削除しました。

これとは別に、私はリリース手順に従いました。

最新のイオンCLIを実行していますか？ 確認できますか？ npm install -g ionic@latest 。

npm run ionic:build --aotを実行して、 ngcがターミナルで実行されていることを確認できますか？ ionic run android --prod --release実行すると、ターミナルにngcれますか？

ありがとう、
ダン

こんにちは@danbucholtz 、

はい--prod--releaseを実行するとngcが表示されます。
また、私はionic @latestを4回以上インストールしました;）cmdを介してエラーなしで-おそらくpackage.jsonのいくつかの設定を変更する必要があります-それらはそれ自体ではアップグレードされませんでした。
また、いくつかの違いを確認するために、毎晩インストールしました。

明日の朝に実行できるもう1つのコマンド。

ご挨拶
Graphefruit

@danbucholtz

はい、最新のionic-cliを使用しています（最後にワークスペース環境情報を参照してください）
また、ターミナルにngcれます。どちらの場合も、それぞれのスクリーンショットをご覧ください。
1） npm run ionic:build --aot
2） ionic run android --prod --release

1）Aotビルド

2）デバイス上で実行中の本番ビルド

それでも、7〜8秒の初期読み込み時間に違いはありません😞😞

cordova CLI: 6.4.0
Ionic Framework Version: 2.0.0-rc.3
Ionic CLI Version: 2.1.17
Ionic App Lib Version: 2.1.7
Ionic App Scripts Version: 0.0.47
ios-deploy version: Not installed
ios-sim version: Not installed
OS: Windows 10
Node Version: v6.9.1
Xcode version: Not installed

@savanvadaliaの長い読み込み時間は、アプリに固有である可能性があります。 スターターアプリまたはイオン会議アプリの番号を試して提供し、番号が比較できるようにすると便利です。

また、イオン角度RC4にアップグレードすることも理にかなっています。

@danbucholtz Care、この投稿はもう少し長くなります：

マイ/カスタムプロジェクト

npm run ionic:build --aot

ionic run android --prod --release

ionic build android --prod --release

まだ10秒の読み込み時間。

スターターアプリ

@astec質問があったら、スターターアプリをインストールしました。
そして、ここで同じようにしました。

1. npm install -g ionic@latest
2. ionic start o5 --v2
3. ionic info

Your system information:

Cordova CLI: 6.4.0
Ionic Framework Version: 2.0.0-rc.4
Ionic CLI Version: 2.1.17
Ionic App Lib Version: 2.1.7
Ionic App Scripts Version: 0.0.47
ios-deploy version: Not installed
ios-sim version: Not installed
OS: Windows 8.1
Node Version: v6.9.1
Xcode version: Not installed

1. ionic platform add android
2. npm run ionic:build --aot
   

3. ionic run android --prod --release
   

4. 時間：
   7.1注1-Android4.1-スタータープロジェクトには約5〜5.5秒かかりました
   7.2。 注2-Android7.0（CM14）-スタータープロジェクトには約5.5〜6.5秒かかりました

会議-アプリ

スターターアプリをダウンロードしました： https ：

1. npm install
2. ionic info
   

->これはrc.4にないようです、これの原因

1. changelogに記載されているようにpackage.jsonを変更しました。

"dependencies": {
  "@angular/common": "2.2.1",
  "@angular/compiler": "2.2.1",
  "@angular/compiler-cli": "2.2.1",
  "@angular/core": "2.2.1",
  "@angular/forms": "2.2.1",
  "@angular/http": "2.2.1",
  "@angular/platform-browser": "2.2.1",
  "@angular/platform-browser-dynamic": "2.2.1",
  "@angular/platform-server": "2.2.1",
  "@ionic/storage": "1.1.6",
  "ionic-angular": "2.0.0-rc.4",
  "ionic-native": "2.2.11",
  "ionicons": "3.0.0",
  "rxjs": "5.0.0-beta.12",
  "zone.js": "0.6.26"
},
"devDependencies": {
  "@ionic/app-scripts": "0.0.47",
  "typescript": "2.0.9"
}

1. node_modules削除しました
2. npm install
3. ionic info
   
4. ionic platform add android
5. npm run ionic:build --aot
   
6. ionic run android --prod --release
   
7. ionic build android --prod --release
   
8. 起動時間
   11.1注1-Android4.1-7-8秒
   11.2注2-Android7（CM 14）-7-8.5秒

画面にコンテンツが表示されるまでの時間は、「アプリアイコンをクリック」して測定しました。
したがって、最新リリースの会議アプリでさえ7〜8秒かかるため、カスタムリリースプロジェクトではありません。
それでも、conference-appはまだ本当に小さく、大きなインターネットアクティビティやhtml-5ファイルシステムはありません。

お役に立てれば。
ご挨拶
Graphefruit

@ jgw96 、あなたは上記を

ありがとう、
ダン

FWIW私はSonyCompact Z3を持っていますが、これはそれほど古くはなく、Android6.xの時代はほとんど同じです。

@ jgw96 @danbucholtz Google Pixelにもインストールしました-会議アプリの起動時間
おもしろい事実：10回の起動時間が8〜10秒になりました。その後、アプリを削除して再度インストールすると、時間が再び3.5〜4秒に短縮されました。

@graphefruitええ、しかし再インストールは正しい方法ではありません。 ;-)
興味深い（プロファイリング）のは、非常に多くの時間が費やされ、他の（角度のある）フレームワーク（Ionic 1、OnsenUIなど）がまったく同じデバイスで単純な「HelloWorld」アプリを起動する速度です。
私の（古すぎない）MotoG2でのRC4confアプリの起動時間は約6秒です：-/

@mpaland確かに、それは正しい方法ではありませんが、見つけたすべての情報を提供することが最善の方法であり、ionicがそれらを使用できることを願っています。
以前にいくつかの投稿で述べたように、Ionic1アプリをIonic2に移植していますが、起動時間は3秒から最大4秒でした。
移植されたプロジェクトは、同じデバイスで7〜8秒かかります。

HTC One M8（Android 6.0-バニラ）

だからあなたの提案の後、私はIonic1プロジェクトをインストールしました：

1. ionic start myproject
2. ionic platform add android
3. ionic build android
4. Ionic1-HTC One M8（Android 6.0）のスタータイムは約2.5秒でした。
5. Ionic 2-会議アプリ-開始時間：5秒
6. Ionic 2-スターターアプリ-スタータイム：4秒
7. Ionic 1-私のカスタムプロジェクト：4秒
8. Ionic2-私のカスタムプロジェクト：7秒。

ショック！ -この文は無視してください。

したがって、ionic 2のスターターアプリを使用しても、違いは約1.5秒です。
HTC OneM8は2014年3月にリリースされました

Moto G（Android 5.1）

それで、ここで次のデバイス-Moto G-Android5.1を使用します。

1. Ionic1-4.5〜5.5秒秒
2. Ionic 2-会議アプリ：8.5〜10.5秒
3. Ionic 2-スターターアプリ：6〜6.5秒
4. Ionic1-私のカスタムプロジェクト-5.5-6秒
5. Ionic 2-私のカスタムプロジェクト-7〜8秒。

ご覧のとおり、まだ1.5秒の違いがあり、会議アプリにはもっと多くの時間が必要でした
MotoGは2013年11月にリリースされました

だから私はそれが今すべての質問に答えるべきだと思います。

_そしてはい：ionic2のすべてのプロジェクトはRC4とappscripts0.0.47でコンパイルされました-誰もが尋ねる前に_

最新のIonicCLIを使用していますか？ バンドルの大きさはどれくらいですか？ npm run ionic:build --aotだけでコンパイルして、 platformBrowserDynamicがそこにないことを確認できますか？ --aotは縮小をスキップする必要がありますが、それでもAoTビルドを提供します。

ありがとう、
ダン

@danbucholtz私はそれをチェックして15分であなたに更新を与えるでしょう

platformBrowserDynamicは、基本的にアプリの起動時にブラウザでngcを実行する必要があることに注意してください。 最終的には、AoTを実行しているかどうかに関係なく、ブラウザーで.ngfactory.js`ファイルを使用しています。 以前の投稿では約20秒かかります。 したがって、ブラウザでのコンパイルの20秒+起動の5秒=長い時間。

5秒はまだ本当に長いです。 何かが正しくありません。

ありがとう、
ダン

@danbucholtzこんにちは、ダン！ ごめんなさい。 最新のスクリプトをインストールしましたが、npm run ionic：build-- aotがカスタムプロジェクトで利用できませんでした。 -私はすでに自分の投稿を一番上に更新しました。

だから私は今新しいプロジェクトを作成し、コンパイルして署名しました、そして今起動時間は7秒に戻っています。

_他のすべてのチェック_-会議/スターターアプリはすべてionic：build --aotを使用しており、platformBrowserDynamicがNOTあることを確認できます。
すべてのZIPを抽出し、 main.js調べました。

またすみません。

@graphefruitさまざまなデバイスでそのような統計を生成するための多大な努力👍
@danbucholtz @ jgw96 、abt Ionic TeamがPlayストアでionic-conference-appの製品版をリリースし、ダウンロードして初期ロードの統計情報を提供する方法。

ロード時間が一致しない場合は、ビルドで何か問題が発生している可能性がありますが、実際にはそうではないと思います。

@danbucholtz RC.0以来、このようになっています。Androidで5秒以内に起動できる人はいないと思います。 Ionic1の起動時間はIonic2よりも優れています。

それを調べて、プロファイリングを行っていただけませんか？
アプリのビルドに正しい手順を使用していることを最初に確認しようとしていることは承知していますが、この問題は過去数か月間あまり変化しておらず、複数のユーザーがこれを報告している場合は、おそらく原因ではないでしょう。ビルドスクリプトの不適切な使用法。
開始するのに5秒以上（そしてそれがここでの最良のシナリオです）以上は、ほとんどすべてのAndroidアプリのショーストッパーです。

私の統計：
Sony Z3 Compact Android 6.0.1-AOT / prod / minifiedビルド（2 MiB JSバンドル）は、Crosswalkの有無にかかわらず開始するのに6秒かかります。 遅いデバイスでは、はるかに長い時間がかかります（私のアプリをテストしたユーザーから、10秒以上が報告されました）。

@danbucholtzチームのデバイステストのセットアップを私たちと共有して

みなさん、詳細な診断とテスト情報をありがとうございました。 これは現在の私たちの最優先事項であり、ここにいる私たちの中には長いロード時間の一部が見られない人もいれば、デバイス/ OSなどに依存している人もいます。 私たちはそれを絞り込んでいます、あなたが持っているどんな追加情報もいつでも歓迎です。

@mlynchこれは5秒の欠落ではありませんが、おそらく、節約する価値のある時間になる可能性があります。

https://github.com/driftyco/ionic-storage/issues/54

イオンライブラリ（ストレージ）の1つが（1回ではなく）2回初期化されているように感じます。 私は非常に間違っている可能性がありますが、それでも、スタートアップのパフォーマンスの向上を探している間、特にここにもっと広い問題がある場合は、これを検討のために投げます

こんにちは、
別のデバイスをテストしました：

Nexus 7（2012）-Android 4.1

Ionic 1-スターター-アプリ：4秒
Ionic 2-会議アプリ：7秒
Ionic 2-スターターアプリ：5.5秒
Ionic1-私のカスタムプロジェクト-5.5秒
Ionic2-私のカスタムプロジェクト-8.5秒

たぶん、今夜、Android6.0を搭載したUlefone-Metalから別のテストを提供できます。

ご挨拶
Graphefruit

Ionicを2.1.17にアップグレードし、 ionic run android --prod実行すると、パフォーマンスが大幅に向上し、アプリが2〜3秒以内に起動します。 何が変わったのかわかりませんが、とても嬉しいです。 ：スマイリー：

@PrithiviRajGもう少し情報を

1. アプリの大きさはどれくらいですか？
2. ionic info -情報
3. package.json -情報
4. インストールされたプラグイン/サードパーティライブラリ
5. どのデバイスを使用していますか？
6. starter-appとionic conference appテストすることもできますか？
   前もって感謝します
   Graphefruit

@graphefruit

1. 私のAPKサイズは7MB、WWWフォルダーのサイズは7.88MB、プラグインフォルダーは67.1 MB、リソースフォルダーは1.01MBです
2. ionic info

 ordova CLI: 6.4.0
Ionic Framework Version: 2.0.0-rc.2
Ionic CLI Version: 2.1.17
Ionic App Lib Version: 2.1.7
Ionic App Scripts Version: 0.0.39
ios-deploy version: Not installed
ios-sim version: Not installed
OS: Windows 7
Node Version: v6.7.0
Xcode version: Not installed

1. package.json

{
  "name": "ionic-app-base",
  "author": "Ionic Framework",
  "homepage": "http://ionicframework.com/",
  "private": true,
  "scripts": {
    "build": "ionic-app-scripts build",
    "watch": "ionic-app-scripts watch",
    "serve:before": "watch",
    "emulate:before": "build",
    "deploy:before": "build",
    "build:before": "build",
    "run:before": "build"
  },
  "dependencies": {
    "@angular/common": "2.1.1",
    "@angular/compiler": "2.1.1",
    "@angular/compiler-cli": "2.1.1",
    "@angular/core": "2.1.1",
    "@angular/forms": "2.1.1",
    "@angular/http": "2.1.1",
    "@angular/platform-browser": "2.1.1",
    "@angular/platform-browser-dynamic": "2.1.1",
    "@angular/platform-server": "2.1.1",
    "@ionic/cloud-angular": "0.5.2",
    "@ionic/storage": "1.1.6",
    "angular2-swing": "^0.10.0",
    "ionic-angular": "2.0.0-rc.2",
    "ionic-native": "2.2.3",
    "ionicons": "3.0.0",
    "rxjs": "5.0.0-beta.12",
    "zone.js": "0.6.21"
  },
  "devDependencies": {
    "@ionic/app-scripts": "0.0.39",
    "typescript": "2.0.3"
  }
}

1. インストールされたプラグイン

cordova-plugin-device
cordova-plugin-facebook4
cordova-plugin-googleplus
cordova-plugin-nativeaudio
cordova-plugin-splashscreen
cordova-plugin-statusbar
cordova-plugin-whitelist
ionic-plugin-keyboard
angular2-swing

1. デバイス情報：MOTOG第1世代-Android5.1

   1. スタートアップアプリとイオン会議をまもなくテストし、お知らせします。

@PrithiviRajG情報ありがとうございます。 最新ではないようです。

Cordova CLI: 6.4.0
Ionic Framework Version: 2.0.0-rc.2
Ionic CLI Version: 2.1.17
Ionic App Lib Version: 2.1.7
Ionic App Scripts Version: 0.0.39
ios-deploy version: Not installed
ios-sim version: Not installed
OS: Windows 7
Node Version: v6.7.0
Xcode version: Not installed

-> RC4ではなくRC2を使用しています-イオンスクリプトも0.0.47になりました。

しかし、おそらくこれは@ jgw96の兆候ですか？

こんにちは、
別のデバイスをテストしました：

Ulefone Metal（Android 6.0）

Ionic 1-スターター-アプリ：3.5秒
Ionic 2-会議アプリ：5秒
Ionic 2-スターターアプリ：4.5-4.7秒
Ionic1-私のカスタムプロジェクト-5秒
Ionic2-私のカスタムプロジェクト-7秒

ご挨拶
Graphefruit

@mlynch好奇心から、初期ロード時間が改善されていることを知りたいだけです。
これは、ツリーシェーキングに関する

ミーティングノートからダンの仕事について知りました。皆さんと一緒に仕事をするのが大好きです。 チームがフレームワークの作業に関してどれほど透明であるかを信じることができません。 ：心臓：

@savanvadalia 、

Ionicをより速くしようとすることは決して終わりません。

現在、適切なツリーシェイクを機能させ、クロージャーコンパイラのサポートを取得することに重点を置いています。 クロージャは、他の方法よりも大幅に小さいJSバンドルを生成する可能性があり、その結果、ロード時間が短縮されます。 また、JavaScriptの読み込みと解析に必要な時間を短縮するために、現在コード分割についても調査しています。

ありがとう、
ダン

@danbucholtzこれを聞いて

私は現在、消費者金融分野の新しい長期製品ラインのフロントエンドおよびモバイルテクノロジーを評価しています。 初期のロードパフォーマンスは重要な決定要因です。

小規模アプリの最近のテストから、iOS / Androidのパフォーマンスは許容範囲内です。 ブラウザの読み込みパフォーマンスもある程度問題ありません。サーバーサイドレンダリングについては後で紹介します。 最も懸念されるのは、より多くのページとサードパーティモジュールを導入し始めたときの初期読み込みパフォーマンスです。

スプラッシュ画面やIonic2 / Webviewアプリの初期読み込みの進行状況を表示する方法はありますか？

彼らは平均します。 アプリの読み込みにかかる時間は約10秒です。 これにより、アプリを読み込むためだけに約10秒待たなければならない場合、ユーザーエクスペリエンスが低下します。 私のアプリは大きくはありません。

npm run ionic:build --aotとionic run android --prodを使用してデバイスで実行し、スターターアプリの初期時間は約2秒ですが、自分のプロジェクトを使用すると、

キャッチされないエラー：モジュール「./app.module.ngfactory」が見つかりません

node_modulesとwwwを削除しましたが、機能しません。
ionic run android実行すると、プロジェクトは機能しますが、初期時間は約7〜8秒です。

これが私のイオン情報です

コルドバCLI：6.4.0
Ionic Frameworkバージョン：2.0.0-rc.4
Ionic CLIバージョン：2.1.18
Ionic App Libバージョン：2.1.9
Ionicアプリスクリプトバージョン：0.0.48
ios-deployバージョン：インストールされていません
ios-simバージョン：インストールされていません
OS：Windows 10
ノードバージョン：v6.6.0
Xcodeバージョン：インストールされていません

アップデート
タイプスクリプトを「2.0.9」にダウングレードすることで問題を解決しました

私が何をするにしても、devicereadyは5秒後に起動します。

全て、

更新を行うために、フレームワーク自体に大幅な改善を加えて、ツリーの揺れとデッドコードの削除を改善しました。 私たちはコード分割とクロージャコンパイラを実験してきましたが、そのような場合はバンドルサイズを劇的に減らしました。 実験がキーワードであり、プライムタイムの準備が整うまでには少し時間がかかります。 このトピックについては、Angularチームと緊密に連携しています。

クロージャコンパイラは素晴らしいツールですが、ルールに従わないと、多くのサードパーティのライブラリや独自のアプリを壊す可能性があるため、これを中心にシンプルでありながら堅牢で柔軟な開発者エクスペリエンスの作成に取り組んでいます。

バンドルサイズの縮小、コード分割、起動速度の向上は、私たちの最優先事項です。

ありがとう、
ダン

@danbucholtzそれは素晴らしいです！ 私は過去にAngularCLIチームにクロージャコンパイラを提案しました。 クロージャコンパイラを使用したコンパイルをオプションにするスイッチが導入される可能性があります。 それを有効にすることができるクロージャーコンパイラフレンドリーなコードを持っている人は、残りは標準的な方法でそれをコンパイルすることができます。 Ionicチームは、コアIonicライブラリとIonicネイティブがクロージャコンパイラと完全に互換性があることを確認できます。 ところで、クロージャコンパイラの有無にかかわらず達成できる最高の起動速度を共有したいですか？

http： //hybridtonative.com、NativeScriptはまだ未成熟ですが、Ionicの問題が発生し続け、オープンチケットが持続または拡大し、WebViewテクノロジーが回転しているため、開発者は作業する代わりにテクノロジーに取り組む必要があります。それと。 基本的なタスクでさえ、膨大な量の回避策、問題の掘り起こし、多くのコード更新の必要性、変更と更新の追跡、終わりのない研磨の泥だらけの基盤に生産を残します。これは実際には悪い設計の選択のバグ修正であり、他の悪い設計の選択を修正します。 結局のところ、私たちは代償を払っており、iOSとAndroidの両方でネイティブにアプリを開発することに匹敵するようになっています。

@barocsi誇張はたくさん？ Angular 2とionicは、彼らが取り組んでいる技術の最先端にあり、私たちの開発者にとって可能な限り最善の行動方針を見つけることに取り組んでいることをご存知ですか？ また、v2stableはまだリリースされていないことにも注意してください。

@barocsi Ionic2に満足できない場合は、Ionic1を使用するか、独自のAngularアプリケーションを作成してください。
あなた自身のAngularアプリケーションでさえ、あなたは彼らのフレームワークですでにイオン解決している多くの問題に出くわすでしょう。
また、このフレームワークはオープンソースであり、貢献することができます。 彼らが取り組んでいる速度に問題がある場合、またはそれをフォークして独自のionic2フォークを作成することができます。
Ionic2にリリース候補があったとしても、ベータリリースサイクルから出てきたばかりだとしても、議論したり、フェンスから何かを壊したりしたくはありません。
しばらくお待ちください。待ちきれない場合は、ionic1を使用して、この市場ですでに数年が経過している横断歩道を使用してください。

提案をありがとう、私は現在および将来の決定のための代替案について疑問に思っています。 すでにいくつかの堅牢で重いIonicV1およびV2アプリがあり、このgithubリポジトリ全体で約1。5年間苦労して問題に貢献してきました。 これはプロイオンスレッドですが、このテクノロジーがどこに向かっているのかを予測する必要がありますが、 @ dylanvdmerweによって最先端のタグが付けられている場合でも、コミュニティによる永続性の対象となるわけではなく、

私はあなたの懸念を理解することができます、それが私が私自身の重いアプリケーションの中でプレーンなangularjsを使用した理由です。
問題は、私がまだ多くの問題に遭遇したことです。なぜなら、すべてを自分で書いたり、最初から書いたりしていなければ、遅かれ早かれそこにたどり着くからです。
私はAngular-MaterialV1（パフォーマンスなど）に大きな問題があり、フレームワークを自分で掘り下げる必要がありました。残りはangularjsで自分で作成しました。
しかし、そこでさえ、パフォーマンスの問題が発生するようになりました。
そのため、「独自の」フレームワークを見つけて修正するために時間を費やす必要がありました。
私は自分でこれらの問題に陥ったので、私は彼らの問題でIonicを理解することができます。
彼らが大企業であっても、リソースも限られています。

次に、Ionic2は単なるAPPではなく、Webサイトも提供し、UWPもサポートし（そしてそれは非常に苦痛です）、PWAもサポートします。
1つのフレームワークに非常に多くの新機能があります。これは主にアプリで使用されますが、他の多くの機能もサポートします。
この機能を使用すると、それらを掘り下げるときに多くの依存関係と多くの問題が発生します。
しかし、あなたの懸念は適格ですが、私はむしろ市場に投入された完全に新しいテクノロジーの問題を見て、Ionicはそれらをつかもうとし、それに多くの依存関係を築きます。

@danbucholtz

ダン、コード分割、クロージャコンパイラ、ツリーシェイクに関する「実験」に関するコメントに非常に勇気づけられ、その起動速度はionic2の現在の最優先事項です（1月4日）。 Githubから離れたionic2会議アプリの例は、進行状況を比較するためにすべての人が使用できる優れたシンプルなベンチマークアプリです。 あなたの仕事がうまく（そして急速に）進行することを願っています。 最近は本当に<= 3秒の起動時間が必要です。そうしないと、ユーザーは「消える」可能性があります-6秒以上で、間違いなく「消える」のです。

--prodを使用して構築され、Nexus 7（2013）Android 6.0.1で起動されました。会議アプリの起動には、現在最大8秒かかります（複数回の起動でのストップウォッチによる平均時間）。

だから、まだかなりの道のりです、ここであなたにすべての成功を祈っています!!! -特に、経験豊富な開発者の観点から、ionic2が提供する構造と機能が本当に気に入っているためです。

フィル

@barocsi私はあなたの状況を理解することができます、そして今のところそれは私にとっても本当に非常に残念です。
要約すると、私のアプリプロジェクトはAndroid、iOS、Win10（デスクトップ）で実行する必要があり、すばやく開始する必要があります。古い（2年を意味する）デバイスでも最大2秒です。
たくさんのライブラリと経験があるので、JSとHTMLで書きたいです。 これにより、フィールドがネイティブ（Java、Obj C）アプリではなくWebViewアプリに絞り込まれます。
特定のハードウェアアクセスが必要なので、Cordovaは良い選択です。 NativeScript、Appcelerator、OnsenUI w / o ng2 ...かもしれませんが、私はそのアイデアがまったく好きではありません。

現時点では、この巨大なコードサイズのせいでng2を非難していますが、適切なツリーシェイクとクロージャコンパイラが、より大きなプロジェクトでの起動時間を大幅に短縮するかどうかはわかりません（ファクター4-5が必要）。 私たちは待つ必要があります...

@mpalandすでに
古いデバイスでも、起動時間が2秒になる方法を本当に知りたいです。
ionic1を使用しないカスタムプロジェクトには、約3秒の起動時間が必要です。ここでは、次のようにします。

1. index.html
2. min.css
3. min.js

以上です。

コルドバ（角度など）を使用して、このような高速のロード時間をすでに達成しましたか？

@graphefruit 、いいえ、私はIonic 1を試していませんし、他に何も試していません

@graphefruit
古いデバイスでも、ionic2が最終的に3秒未満の起動を達成することを本当に望んでいます。 私はすでに別のハイブリッドフレームワーク+ cordovaで「箱から出して」それを達成することができます。 ただし、ionic2はangular2上に構築された非常に優れた血統を持っているため、私はionic2を使用することを強く望んでいます。これにより、優れたサポート、ドキュメント、機能などが提供されます。私のような経験豊富な開発者はすべてを高く評価しています。

@philrob他のハイブリッドフレームワーク+コルドバ（プロジェクトに必要なすべてのものを含む）が3秒未満であなたをもたらすことに非常に興味があります。 教えてください。

lordgreg
他のフレームワークを導入するのに実際には適切な場所ではありません。 ionic2チームが起動時間を大幅に短縮し、3秒未満の目標に近づけることができることを願っています。

やあ
私のionic2アプリケーションの起動にはまだ10秒かかりますが、ionic1アプリケーションの起動には4秒しかかかりません。初期読み込み時間を改善する方法を教えてください。これは非常に重要です。

@philrob真剣に、他のコメントをチェックすると、常に比較があることにすぐに気付くでしょう。 一体、このスレッドでさえそれらを持っています。 あなたが言っていることは嘘ではありませんが、Cordovaコンテナ内でjQuery（例）しか実行しないハイブリッドアプリが3秒未満で開くことを説明するのはまったくばかげています。 スタイリングを処理しないか、少なくともIonicほど複雑ではないフレームワークを使用するか、他の巨大なライブラリ（angular2）に依存しないフレームワークを使用することは、昼と夜を比較するようなものです。 それは意味がありません。

@ mobinius-shreeshaはプロジェクトをionic build android --prodまたはionic run android --prodとして実行し、起動時間を5秒にします。 デバッグモードで実行すると、 ionic run androidは時間が10秒以上に増加します

lordgreg

私たちが同意しないとは思わないでください。 そのため、Githubのionic2の会議アプリ（--prodで構築）を使用して、Nexus 7（2013）Android 6.0.1専用の起動タイミング（約8秒）を意図的に使用することにしました。 明らかに、別のフレームワークが同じ機器でより速い起動時間を達成し、それでも私が必要とする機能（スタイル付きUIモバイルウィジェットを含む）を提供できる場合、私にとっては関連する、

私は繰り返します-私は以前に与えた他のすべての重要な理由のために本当にionic2が好きです、ただ発射速度が大幅に改善されるのを見たいだけです。 ionic2チームに必要な時間を与える必要があると思います...

また、起動時間が長くなることを楽しみにしています。

Ionicチームは、先週のionic-app-scriptsのv1のリリースで素晴らしい仕事をしたと思います。 これにより、私の環境ではビルド時間が大幅に改善されました。

彼らはアプリの起動時間でも同じことをすると確信しています。

問題は他の場所にあると思います。ionicv2はrc状態です。 ただし、これはほとんどの開発者が尊重しなければならないことです。Ionicチーム側では、ionのドキュメントは、v2が本番環境に対応しているものであることを初心者に示唆しています。 その場合は異議を唱えないでください。 ドキュメントでさえ、デフォルトでv2になっています。

チームからのこの欺瞞的な行動は、自発的であるかどうかにかかわらず、業界からの圧力の結果のようなものです。 Ionicsの唯一のダービバルは、コミュニティが別の新しいクロスプラットフォームテクノロジーに切り替える前に、大きな開発ベース（js + angular2）を持つ高度なものをレイアウトすることに依存しています。たとえば、前に私が言及したもの：Nativescript

したがって、Ionic teemは、v2がIonicの事実上のバージョンであることを示唆している必要があります。 ただし、この場合、値札が高くなる可能性があります。重要な部品が含まれる製品を、できるだけ早く修正せずにエラーで展開すると、コミュニティからの不信感が生じ、製品を最先端として位置付ける前に2、3か月待つよりも危険な場合があります。成熟したメジャーアップグレード。

開発者は作成する必要があり、一歩後退するか修正が不足するたびに、他のソリューションに目を向けて、クライアントに対する将来と安定性をヘッジします。

これに関する更新はありますか？ :)

@PrithiviRajG回答ありがとうございます。10秒以内にアプリを起動できますが、起動時間を改善するためのionic2のアップデートはありますか。フルバージョンのionic2のリリースを計画している場合、何か考えはありますか。

現在のプラグインがインストールされ、現在のイオンバージョンで14.99秒のコールドブート：

com-badrit-base64 0.2.0 "Base64"
com.synconset.imagepicker 2.1.7 "ImagePicker"
cordova-plugin-camera2.3.1「カメラ」
cordova-plugin-compat1.1.0「互換性」
cordova-plugin-console1.0.5「コンソール」
cordova-plugin-device1.1.4「デバイス」
cordova-plugin-dialogs1.3.1「通知」
cordova-plugin-nativestorage2.2.0「NativeStorage」
cordova-plugin-secure-storage2.6.3「SecureStorage」
cordova-plugin-spinner-dialog1.3.1「SpinnerDialog」
cordova-plugin-splashscreen4.0.1「スプラッシュスクリーン」
cordova-plugin-statusbar2.2.1「ステータスバー」
cordova-plugin-whitelist1.3.1「ホワイトリスト」
ionic-plugin-keyboard2.2.1「キーボード」

システム情報：

コルドバCLI：6.4.0
Ionic Frameworkバージョン：2.0.0-rc.1
Ionic CLIバージョン：2.1.18
Ionic App Libバージョン：2.1.9
Ionicアプリスクリプトバージョン：0.0.48
ios-deployバージョン：1.9.0
ios-simバージョン：インストールされていません
OS：macOSSierra
ノードバージョン：v6.9.2
Xcodeバージョン：Xcode8.2.1ビルドバージョン8C1002

@tryadelionの現在のイオンバージョンはrc1ではなくrc4です。

皆さん、これに関しては多くの変更があるはずなので、RC5またはリリースを待ちましょう。

rc4にイオンアップデートを強制するにはどうすればよいですか？ 私の遅れを引き起こしているかもしれない他の時代遅れのものはありますか？

私にとって、ionicv1の複雑なプロジェクトは1.8MBのbuild.jsでしたが、v2の基本的なプロジェクトmain.jsは6.7MBを超えています。
起動時間に必ずしも影響を与えないcordovaプラグインの追加または削除。

皆さんこんにちは！ この問題を閉じて、今のところスレッドをロックします。 この時点で、ロード時間とフレームワークの速度を改善し、どこでも機能するようにするために多くの作業を行ってきました。

これは常に動くターゲットであり、私たちが常に考えていることです。 この問題は最初は役に立ちましたが、その後脱線し、従うべき明確な問題ではなくなりました。 他に問題がある場合は、私たちが求めるすべての情報を記載した新しい問題を開いてください。