Angular 1方式绑定不影响性能答案

【问题标题】：Angular 1 way binding not affecting performanceAngular 1方式绑定不影响性能
【发布时间】：2016-08-14 13:04:21
【问题描述】：

我正在从事一个严重依赖 Angular 来完成前端任务的项目。在一个显示大约 50 个带有 ng-repeat 的条目的列表页面上，每个条目都有很多观察者，所以我决定使用 angular 的静态绑定减少观察者的数量，并且能够减少数量。从 12k 观察者到 8k 观察者，但即使观察者大幅减少，加载时间、dom 渲染或摘要循环时间也没有改善。 8k 观察者的摘要周期与 12k 观察者所花费的时间几乎相同或多一点，因此似乎 angular 的 1 次绑定在这里没有帮助。我使用了 chrome 的角度扩展batarang 和库ng-stats。我想到的问题是：
1）为什么静态绑定/单向绑定不提高性能？
2) 减少数量。的观察者应该减少摘要周期并加快内容加载时间？
3）在这种情况下，还有其他加快速度的技巧吗？（除了资产缩小）。

【问题讨论】：

8k 观察者？ 8000？这些是很多观察者。设计有问题。您的页面加载时间是多少？
您可以通过为“父级”设置 1 个侦听器并通过 event.target 识别单击的列表项来减少侦听器，而不是为列表中的每个项目设置点击侦听器。检查此链接以供参考：kirupa.com/html5/handling_events_for_many_elements.htm
你最初的观察者仍然是 12k 并且有一次绑定，但是当你在 batarang 或 ng-stats 中看到它时，那些 4k 已经在这些统计数据收集时消失了，所以你不会得到性能从中受益。
@RahulB 是的，我正在尝试减少它们。
@YOU batarang 统计数据令人困惑，但 ng-stats 更好。实际上 ng-stats 显示的是不断更新的图表，所以它一直保持在 8k。

标签： javascript angularjs performance

【解决方案1】：

如果减少 4k 的观察者数量。只需少执行 4k 检查即可。如果你可以认为它们是简单的字符串值，那么少 4 000 个字符串比较就没什么了。

关于 ng-repeat 性能：如果你不使用它，你应该使用它。 Track by 允许您指定 Angular 应该检查以检测更改的列表的唯一键。

如果您有大量数据，请务必小心您放入 $scope 中的内容，如果您不需要其中的一些（例如内存中的一些巨大列表），Angular 会监视范围内存储的所有内容，您不应该将它们存储到$scope。当然，如果您使用 controllerAs 语法，这意味着您不应该将它们放入 this

您的应用程序中可能存在一些瓶颈，您应该首先专注于找到它们。

这样做的一种天真的方法只是评论/删除您的视图的某些部分并检查会发生什么。

另一个提示：你有一些看起来像的代码：

$http().then(function(){
   $http().then(function(){})
});

如果是这样，请检查您是否真的需要它，或者您是否可以单独加载它们。如果您需要执行多个请求并等待所有结果执行分组处理，请使用$q.all([arrayOfPromise]).then(function([arrayOfResults]){})

【讨论】：

我确实使用 track by。我没有在$http 上链接承诺，所有数据都在应用程序启动时加载服务。