2017-06-05 18 views
0

私はバックエンドから表形式のデータを定期的に取り出し、HTMLで表示するために$タイムアウトを使用しています。私は更新が得られるたびにJSON配列のブラウザに新しいメモリセグメントが割り当てられていると思います。私はそれが事実かどうか疑問に思っていた。以下はコードの単純化された断片です。AngularJS配列とインクリメンタルメモリの使用

HTML `

<tr ng-repeat="measurement in measurementResults"> 
    <td>{{measurement.type}}</td> 
    <td>{{measurement.value}}</td> 
</tr> 

JS

function startTimeout() { 
    MeasurementService.getNewMeasurements(function (measuredData) { 
    $scope.measurementResults = measuredData; 

    }); 

    $timeout(startTimeout, 15000); 

} 

startTimeout(); 

これは、私は$スコープに渡していJSONデータ配列形式です。

[{"type":type1,"value":10}, {"type":type2,"value":20}, {"type":type3,"value":80}] 

私は、サービスコールバックからmeasuredDataを受信するたびに新しいメモリ位置を指す(または新しい配列を作成する)$ scope.measurementResultsですか?

編集:私はメモリグラフの2枚のスクリーンショットを添付しています は、最初のものは、ノードが上がるとダウン(グリーンライン)、2つ目は$で、」トラックを適用した後のラインがフラットになる方法を示しています方法を示していますインデックス」

enter image description here


Memory usage for nodes stable

+0

はい、毎回XHRは、サーバからデータを受信するために新しいメモリを使用しています。 [代入演算子](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Operators/Assignment_Operators#Assignment)は '$ scope.measurementResults'を新しいメモリにポイントし、古いメモリはガベージコレクションのために解放されました。 – georgeawg

+0

私は、この種の定期的な呼び出しがあるすべてのページで、ChromeやFirefoxなどのインクリメンタルメモリの使用状況を観察します。私はそれが私のコードによるものなのか、それともブラウザが古いメモリを解放していないからなのか分かりません。私はサファリでこれを観察しませんが、安定しています。 – user2217057

+0

AngularJSのどのバージョンを使用していますか? Version1.3で修正された 'ng-repeat'メモリリークの問題がありました。詳細については、[GitHub AngularJS Issue#10121](https://github.com/angular/angular.js/issues/10121)を参照してください。 – georgeawg

答えて

0
//You may use track by for performance boost 
<tr ng-repeat="measurement in measurementResults track by $index"> 
    <td>{{measurement.type}}</td> 
    <td>{{measurement.value}}</td> 
</tr> 
+0

$ indexによるトラッキングはメモリ使用量を大幅に減らしました。各呼び出しで約1 MBが漏れて、呼び出しごとに10-20 KBまで減少しました。私は複数のng-repetsを入れていました。この "track by"は非常に良い仕事でした。しかし、このようなメモリリークの問題は、georgawgが指摘しているように、まだ1.5の角度でもrg-repeatで漏れているように見えます。 – user2217057

+0

スクリーンショットは軽量テストページのものですが、実際のものではありません。 – user2217057

+0

まだパフォーマンスの向上のために片方向バインディングを使用することができます。このドキュメントを参照してください。それは意味があり助けになります。https://stackoverflow.com/questions/33480548/what-is-the-difference-between-ng -bind-vs-one-time-binding-in-angular –