Javascript 视图模板中的角度表达式是否会降低角度应用程序的性能

我的应用程序似乎有很多逻辑视图。我的问题有两个：

视图中的逻辑是否会降低应用程序的性能

作为最佳实践，在控制器中处理此逻辑并将结果存储在视图可以访问的$scope属性中是否更好？ 这会提高性能吗

我们应用程序中的视图示例（一个简单的视图）：

{{config.message | translate:config.getMessageParams（通知）}

简短回答： 是

长答覆：

您的绑定必须在每个影响所用变量的摘要周期中更新。 将值存储在变量中，并且只有在发生更改时才更新它才能提高性能。 然而，只有当您达到一定程度的复杂性时，这才是关键。只要你的应用程序没有增长太多，这不会是一个威胁考虑-尚未

我不一定把它称为最佳实践，因为它会使代码更复杂，更难阅读/理解/维护。 性能并不总是一个问题。默认情况下，它一不存在就开始变为1；）

您可以做的进一步改进是尽可能使用ng bind和ng bind html，因为它可以更快地呈现，因为它可以在编译表达式时跳过angularJS的一些内部步骤

例如，使用

<div ng-bind="foo"></div>

而不是

<div>{{ foo }}</div>

{{foo}

---

如果可能的话

这些性能考虑因素背后的关键概念是减少Angular中的$$观察者的数量，以提高$digest循环的性能，随着您继续使用Angular，您将看到和听到更多的内容。这些对于保持应用程序状态对用户的快速响应至关重要。每次通过视图中的用户输入或控制器的服务输入更新模型时，Angular都会运行一个称为$digest循环的程序

此循环是一个内部执行循环，它运行于整个应用程序的绑定中，并检查是否有任何值发生了更改。如果值已更改，Angular还将更新模型中的任何值，以返回到清除的内部状态。当我们使用AngularJS创建数据绑定时，我们将创建更多的$$watchers和$scope对象，这反过来又会在每个$digest上花费更长的时间来处理。在扩展应用程序时，我们需要注意我们创建了多少作用域和绑定，因为这些作用域和绑定加起来很快——每个$digest循环都会检查每个作用域和绑定

Angular在发生更改后，每个$digest循环运行每个过滤器两次。这是一项相当繁重的工作。第一次运行是从$$watchers检测到任何更改，第二次运行是查看是否有需要更新值的进一步更改

这是一个DOM过滤器的例子，这是最慢的过滤器类型，预处理我们的数据会快得多。如果可以，请避免使用内联筛选器语法

{{ filter_expression | filter : expression : comparator }}

$filter('filter')(array, expression, comparator);

Angular包含一个$filter提供程序，您可以使用它在解析到DOM之前在JavaScript中运行过滤器。这将在将数据发送到视图之前对其进行预处理，从而避免了解析DOM和理解内联过滤器语法的步骤

{{ filter_expression | filter : expression : comparator }}

$filter('filter')(array, expression, comparator);

是的，为了获得更好的性能，请使用

$scope.description: $translate.instant('DESCRIPTION') 

在控制器中，而不是

{{'DESCRIPTION' | translate }}

此外,

这取决于你想要实现什么。下面是提高性能的另一种方法。

---

Angular 1.3添加了：：符号以允许一次绑定。总之，Angular将在第一系列摘要循环之后等待值稳定，并使用该值渲染DOM元素。之后，Angular将删除忽略该绑定的观察者。

PS，在可能的情况下使用一次性绑定。

：

您能提供此绑定的来源吗？因为我相信直到现在很多人都认为这是同一件事，但它阻止了花括号的数据闪烁，这可以通过ng斗篷解决。其他不幸的是，我记不起任何主要来源，尽管我确信它们确实存在，因为我在这里读到了它们，这是一篇关于ng bind的更详细、更高投票率的帖子——它的性能提升：谢谢。但是最好记住，使用ng bind时，OP将丢失双向绑定，如果可以丢失双向绑定，则最好使用{：：}。这篇文章是关于ng bind和{{expression}的区别。它们都不提供“双向绑定”，它们都只是单向绑定，因为表达式无论如何都不能更改变量的值。所以这与{：：}无关公平地说，我不认为你的最后一个论点是正确的：{{}的问题是当你有blablabla{{{foo}}blblbl Angular时，你会观察整个字符串，而不仅仅是更重的{{foo}。这就是为什么你使用ng绑定。