web-dev-qa-db-ja.com

Ionic:インストールされているアプリの遷移が遅いAndroid app

Ionicアプリ(ベータ14)をAndroid(Lollipop)デバイスにインストールしました:

ionic platform add Android
ionic run Android

また、手動でアプリをビルドし、adbを使用してインストールしました。

アプリはイオンサイドメニューを使用し、シンプルなビュー(リスト->詳細->詳細)間の遷移のアニメーションは、対応する電話では非常に遅くなります。対照的に、サイドメニューがスライドするときのアニメーションは非常にスムーズです。

状況をさらに調査するために、開発マシンからwwwディレクトリを提供し、そのページを電話でChrome)で開きましたが、予想どおりスムーズでした。アプリはiOSでもスムーズに実行されます。デバイス。

アプリがIonicの場合、なぜこれほど遅いのかについての手がかりはありますが、ブラウザーでレンダリングされているだけの場合は期待どおりに機能しますか?

18
jbeck

私は同じ問題に直面しました。大量の情報をロードする必要がある場合はさらに悪化します。その場合、次のように設定してトランジション効果を無効にします。

nav-transition=none

コントローラからの移行を無効にする必要がある場合は、次の手順を実行します。

app.controller('ctrl', function($scope,$state, $ionicViewSwitcher){ $scope.goBack = function(){
    $ionicViewSwitcher.nextTransition('none');
    $state.go('back');
});
7
Adam Boostani

ionic apptransitiosn。で問題に直面するいくつかの解決策を見つけました。

  1. 状態変更後、私はこのコードを使用します。

// OnStateの変更。。

$scope.$on('$stateChangeSuccess', function() {

    $ionicLoading.show();

   MyTeamListing();

  })

状態を変更するたびにサーブをヒットします。これはアプリの速度を低下させます。

最初の行を削除するだけで、コードは正常に機能しています...

それが良い方法か悪い方法かはわかりませんが、うまく機能しています。

トランザクションにロードされるデータが多すぎるとトランザクションが遅くなるため、トランザクションの完了後にデータをロードするionicイベントを使用します。

$scope.$on('$ionicView.afterEnter', function(){
            console.log("afterEnter"); 
            $ionicLoading.show();
            loadRemoteData();
            $ionicLoading.hide();
});
2
SuReSh

ハイブリッドアプリケーションを開発するメリットは、コードの再利用性と開発の高速化ですが、開発で得られる利点遅いハイブリッドアプリ。次の点に従えば、アプリケーションを比較的高速にすることができます。

  • コメントや不要な機能は絶対に削除してください
  • 空白を最小限に抑え、関数をできるだけ小さくします
  • 縮小されたcssとjsを使用する
  • 画像を最適化するほど、画像が少ないほどアプリケーションは高速になります
  • 可能であれば、画像をプリロードします ここをチェックしてください
  • 不要なjsファイルをページの下部のbodyタグの終わりの直前に保持します
  • 不要なページ、不要なスクロール、大きなページを削除します。
  • 入力ボックスの使用を制限します。可能であれば、ラジオボタン、チェックボックス、コンボボックスを利用してください。
  • 必要がない限り、jqueryライブラリを使用しないでください。javascriptを使用してください。
0
Sunil Lama