2016-09-21 12 views
0

私は50行のテーブルを作成し、CSSのオーバーフローがテーブルの親要素にスクロールするようにしました。スクロールするたびに、テーブルに5行追加します。それはhtmlでうまくいきます。しかし、私はこれをイオンフレームワークに変換し、パフォーマンスの遅れを得ました。イオンフレームワークでDOM操作を実行すると、なぜパフォーマンスの問題が発生するのですか?イオンフレームワークでのパフォーマンスの問題

+0

イオン成分は、モバイル環境に最適化されているため、使用してください。レンダリングの問題はモバイルハイブリッドアプリケーションでは一般的です。イオン性の問題ではなく、アプリのブラウザに組み込まれています。次に、angularJsは多くのDOM操作を行っているため、DOMの修正をtipからangularに変更することで、パフォーマンスの問題が顕在化する可能性があります。 –

答えて

2

一度だけ実行するか、または評価する必要があるすべての角度指令にの一時バインディング演算子 '::' を使用することを忘れないでください。変更を監視する必要がない場合は、 ng-class、ng-if、ng-switch ...)、また、ラベル、テキスト、フィールド、およびデータで満たされたものなどがあります。

あまりにも角度の相互作用を伴うng-repeatを実行すると、多くのウォッチャーが作成される可能性があります。したがって、あなたのアプリの性能は劇的に低下します。 1ngクリック、1ngクラス、3つのフィールドでhtmlの部分のng-repeatを想像してみてください。これらは、5ウォッチャーあるあなたのリストはあなたがNGリピート指示に:: ALGO使用することができます変更するつもりされていない場合、その5 X 50行も250ウォッチャー ...

です。例:

<div ng-repeat="item in ::ctrl.items"></div> 
0

代わりのng-repeat="item in items"、あなたがcollection-repeat="item in itemsを使用することができ、イオンのために。それは、イオンのためのng-repeatの実際に最適化されたバージョンです。詳細情報チェックアウトのために:collection-repeat in ionic

関連する問題