angularjs - angle.jsのパフォーマンスの問題

Question

[パフォーマンス]タブのBatarangは、アプリのルートで、angularが次のような関数を呼び出していることを示しています function (a){var e,f,i=a.$eval(h),m=hc(i,。

batarangによると、それは痛々しいほど遅く、アプリの行が少し増えると、アプリの速度が低下し、Firefoxがクラッシュします（Chromeは引き続き処理します）。それで、一体何をしているのですか？どうすれば修正できますか？

Answer 1

ngRepeat のコンテンツを動的に拡張する Angular アプリケーションを構築する際に考慮すべき事項。設定した ngRepeat ごとに、ウォッチが設定されます。その繰り返しの中で行うすべての {{binding}} または ngModel は、別のウォッチをセットアップします。これらはそれぞれ、関数とオブジェクトのインスタンスを作成し、$digest ごとに処理する必要もあります。したがって、パフォーマンスの問題が発生した場合は、余分な監視を設定せずにデータを書き出すカスタム ディレクティブを実装する必要がある場合があります。これにより、パフォーマンスが少し向上します。それは私の2セントです。

Answer 2

そのため、同様の問題があると思われる問題が発生したときに質問が行われた後、今月出くわしました。私の問題と解決策 (ディレクティブは関係ありません) について説明します。それがあなたの問題に当てはまるかどうかを確認できます。

テーブルを作っていました。まず、テーブルに含まれる行を示す情報を要求し、次に、テーブルのセルを埋める詳細情報を要求します。したがって、最初のリクエストを取得し、すべての行をテーブルに追加してから、セル データをリクエストします。行ごとにセル データをフェッチしますが、大きなテーブルでは、これでも多くの要求が発生します。その行のセル データが返ってきたら、それを埋めます。

これにより、非常にクールな効果が生まれました。回転するアイコンを持つすべてのセルがデータを待機しています。しかし、それは本当に遅くなりました。Chrome ではそれで問題ありませんでした。ブラウザの速度はいくらか低下しますが、引き続き動作します。しかし、FF では、「スクリプトがビジーであるか、応答していません」という迷惑なメッセージが表示されます。[続行] をクリックすると正常に動作しますが、[キャンセル] をクリックするとスクリプトが停止し、何も動作しません。

だから、ここに私が思いついた解決策があります。ディレクティブは不要です。私が行ったのは、各行のデータを完全に構築し、その行を ng-repeat で使用される変数に追加することだけでした。このようにして、はるかに高速になります。すべてのデータを取得すると行がいっぱいになり、$watch はまだそこにありますが、一度に大量のデータをトリガーするわけではなく、後でデータを変更できるようにすることができます (私のテーブルでは、テーブルの各セルを編集して、後でデータを簡単に変更できることが重要でした)。

これが誰かに役立つことを願っています。