2017-05-23 58 views
0

我正在研究增強角度摘要循環的選項。角度摘要循環的高級提升

我在任何給定的時間與數萬活躍觀察家一個相當複雜的應用程序。

作爲我註冊上滾動事件(和在動畫幀處理它們)的應用程序的功能的一部分,所以該摘要每個滾動,這導致以fps偶爾降基本上執行。

我已經減少了觀察家們一次性綁定算,現在我只剩下幾千觀察家。

目前,我試圖寫一個指令暫停了視元素的所有觀察者。

於是我開始用角內部玩耍,並與下面的指令上來:

app.directive('ngSuspendable', function() { 
    return { 
     restrict: 'A', 
     scope: true, 
     link: function (scope, element, attr) { 
      var _watchersMap = {}; 
      var _suspended = true; 
      suspendWatchersTree(); 

      function suspendWatchersTreeRecursive(currentScope, includeSiblings) { 
       while (currentScope != null) { 
        if ((currentScope.$$watchers != null) && 
         (currentScope.$$watchers.length > 0) && 
         (typeof _watchersMap[currentScope.$id] == "undefined")) { 
         _watchersMap[currentScope.$id] = currentScope.$$watchers; 
         currentScope.$$watchers = []; 
        } 

        if (currentScope.$$childHead != null) { 
         suspendWatchersTreeRecursive(currentScope.$$childHead, true); 
        } 

        if (includeSiblings) { 
         currentScope = currentScope.$$nextSibling; 
        } 

        else { 
         currentScope = null; 
        } 
       } 
      } 

      function unsuspendWatchersTreeRecursive(currentScope, includeSiblings) { 
       while (currentScope != null) { 
        if ((typeof _watchersMap[currentScope.$id] != "undefined") && 
         (_watchersMap[currentScope.$id].length > 0)) { 
         if ((currentScope.$$watchers != null) && 
          (currentScope.$$watchers.length > 0)) { 
          currentScope.$$watchers = currentScope.$$watchers.concat(_watchersMap[currentScope.$id]); 
         } 

         else { 
          currentScope.$$watchers = _watchersMap[currentScope.$id]; 
         } 
        } 

        if (currentScope.$$childHead != null) { 
         unsuspendWatchersTreeRecursive(currentScope.$$childHead, true); 
        } 

        if (includeSiblings) { 
         currentScope = currentScope.$$nextSibling; 
        } 

        else { 
         currentScope = null; 
        } 
       } 
      } 

      function suspendWatchersTree() { 
       suspendWatchersTreeRecursive(scope, false); 
      } 

      function unsuspendWatchersTree() { 
       unsuspendWatchersTreeRecursive(scope, false); 
      } 

      scope.inView = function(evnt, model, htmlElementId, triggeringEvent, isInView, inViewPart) { 
       if (!isInView) { 
        suspendWatchersTree(); 
        _suspended = true; 
       } 

       if ((isInView) && (_suspended)) { 
        unsuspendWatchersTree(); 
        _watchersMap = {}; 
        _suspended = false; 
       } 
      } 
     } 
    } 
}); 

在初始化這個指令將刪除當前範圍內的所有觀察者和所有子範圍(不知道是否捕捉也隔離示波器) 。 然後,當元素在視圖中時,它會添加觀察者,並在觀察視線時將其刪除。

我知道它並不一定會捕獲所有的觀察者,因爲有些觀察者可能會在鏈接後添加,但這似乎可以忽略不計,並且一旦元素進入視圖並再次出現視圖,它們將被刪除。如果我能以某種方式掛鉤觀察者添加並將它們添加到地圖中,但是我猜測它不是必須的。

這似乎是工作很好,但我不知道什麼是這種方法的注意事項。我對玩弄有角度的內部裝置和弄亂事物並造成不穩定狀況感到不舒服。

任何想法和意見,將不勝感激。

+1

聽起來像你想要的是[codereview.se]。詢問工作代碼的好網站。請務必閱讀他們的幫助中心,以確保您的問題與主題相關。 –

回答

0

我已經使用最近的更改更新了上述代碼。 進一步測試表明它工作得很好,有些手錶可能不會在初始化時暫停,但這是我可以接受的價格。它大大增強了我的摘要循環,並通過從視口元素中移除不需要的手錶來提升應用性能。