javascript - View 模板中的 Angular 表达式会降低 Angular 应用程序的性能

Question

我的应用程序中的 View 似乎包含很多逻辑。我的问题有两个方面:

1. View 中的逻辑是否会降低 Angular 应用程序的性能？

2. 作为最佳实践，是否最好在 Controller 中处理此逻辑并将结果存储在 View 可以访问的 $scope 属性中？这会提高性能吗？

我们应用中的 View 示例(一个简单的):

<div class="small-12 column" id="notificationMsg">
    {{ config.message | translate : config.getMessageParams(notification)}}
</div>

Answer 1

简答:是

长答案:

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

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

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

例如使用

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

代替

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

如果可能的话