火力地堡高內存和CPU使用率

我有以下控制器火力地堡高內存和CPU使用率

var myApp = angular.module("MyApp", ["firebase"]); 

    function MyController($scope, $firebase) { 
    var rootRef = new Firebase("vivid-fire-447.firebaseio.com/products"); 
     // Automatically syncs everywhere in realtime 
     $scope.products = $firebase(rootRef); 
     $scope.products.$on('loaded', function(){ 
      var index = $scope.products.$getIndex(); 

      $scope.total = function(){ 
       var total = 0; 

       index.forEach(function(i){ 
        total += $scope.products.$child(i).price; 
       }); 
       return total; 
      }; 
     }); 

     }

和下面的HTML

<div ng-app="MyApp"> 

    <div ng-controller="MyController"> 
     <ul> 
      <li ng-repeat="product in products | orderByPriority">{{product.code}}</li> 
     </ul> 
     <div>Total = {{total()}}</div> 
    </div> 

</div>

的問題是，當我告訴產品鉻CPU的總價被在100掛％和內存使用率開始迅速攀升，最終該選項卡掛起。

我注意到使用AngularJS Batarang，總方法被稱爲連續？

如何以有效的方式獲得所有產品的總價格？

JsFiddle

來源

2014-03-28 Cesar

我想你的例子，其運行沒有任何問題;它在不到1秒內加載。我不認爲你上面顯示的代碼/數據準確地反映了這個問題。不過，我確實記下了一些可能會遇到的問題。

$scope.getTotal的定義位於$scope.products的加載事件中，這意味着該函數可能在Angular首次嘗試編譯此頁時存在。您可以矯正通過給它一個空數組開始，並移出加載的回調：

$scope.products = $firebase(rootRef); 
    var index = []; 
    $scope.products.$on('loaded', function(){ 
     index = $scope.products.$getIndex(); 
    }); 
    $scope.total = function(){ /*...*/ }

的代碼創建通過調用$child到火力地堡一個新的同步連接每個記錄。因爲所有的數據已經存在於父對象中，所以沒有必要這樣做。一般情況下，你不需要使用$child，因爲它是爲一些特殊用例：

total += $scope.products[key].price; // far more efficient!

這裏有一個小提琴展示了變化。在我的盒子裏，它的加載時間不到半秒鐘，即使是小提琴包含代碼的開銷。

http://jsfiddle.net/katowulf/Q6VPx/

來源

2014-03-28 16:38:45 Kato

我的代碼加載速度快，問題就陷入了一個無限循環（你必須改變我的小提琴插值'總（）'然後使用Chrome的任務管理器，查看症狀），我最好的shot：$ child會以某種方式導致更改事件，並且會角度調用'total（）'，這會再次觸發更改事件，等等。你的代碼通過不使用'$ child'解決了這個問題，謝謝！並感謝其他指針。 – Cesar

塞薩爾，這是有道理的，似乎極有可能是罪魁禍首！ – Kato

火力地堡高內存和CPU使用率

回答

相關問題