angularjs 性能最佳实践

Question

我采用了基于 johnpapa style guide 的风格，并且根据 Miško 在 49:44

上关于 Angularjs MTV meetup Best Practices 的演讲

他说性能取决于两件事：

How many binding you have.

How expensive you getter. (should fast)

而且我认为这意味着简单和快速。在我的理解中 getter 表示服务中的一种方法。但就我而言，有点复杂。那么如何让它变得简单呢？我来宾不可能改变算法？或者只是调用服务中的内部（私有）函数？生效了吗？

所以这是我的问题：

Best practice to make getter on a method in service so will not cause memory leak.

I hope somebody can make an clear axample with the explanation

How IIFE work ?

Can somebody explain it to me?

How IIFE work on a function inside factory (method in service)?

Is it remove the global variable too? even if i use var, like when we return a factory?

Answer 1

您的问题（或多个问题）相当广泛。你在这里混淆和组合了多个概念，但我会尽力为你解开。

首先，IIFE。这与 Angular 性能无关。 IIFE 是一种为全局范围命名空间的方法。因此，最好的做法是使用 IIFE，而不是在全局范围内公开可能导致冲突的函数。

var globalObj =
    (function(){
      var privateVar = 5;
      function doPrivateFn(x, y){}

      return {
        publicFn: function(x){ doPrivateFn(x, privateVar) };
      }
    })();

现在，唯一暴露给全局范围的是 globalObj，它有 globalObj.publicFn().

其次，在使用Angular而不是内联匿名函数注册服务或控制器时，有时会使用IIFE：.factory("MySvc", function(){}):

(function(){
  angular.factory("MySvc", MySvcFactory);

  function MySvcFactory($http){
    // ...
  }
})();

这一切所做的只是在全局范围内隐藏 MySvc 工厂函数 MySvcFactory。

最后，让getters变快的重点不是内存泄漏，而是getter函数的计算强度。

因此，如果您在表达式中有绑定，如下所示：

<span>{{getCount()}}</span>

或者这个：

<div ng-show="isShown(item)">{{item.prop}}</div>

我们的想法是让这些功能变得非常快，如果不仅仅是 getter:

$scope.isShown = function(item){
  return (item.a || item.b) && $scope.somethingElse;
}

永远不要做这样的事情：

<div ng-show="isUnique(item)">{{item}}</div>

其中 isUnique 执行 for 循环搜索：

$scope.isUnique = function(item){
   for (var i = 0; i < list.length; i++){
     if (item === list[i]) return false;
   }
   return true;
}

因为这个函数会在每个摘要周期运行，有时甚至多次。相反，计算唯一性并将结果缓存在某个地方，这样你就可以 return 它。

angularjs 性能最佳实践

angularjs performance best practices

javascript

coding-style

angularjs

他说性能取决于两件事：

所以这是我的问题：