Angular ng-if 与 ng-switch 性能答案

【问题标题】：Angular ng-if vs ng-switch performanceAngular ng-if 与 ng-switch 性能
【发布时间】：2017-06-16 07:59:57
【问题描述】：

我在想哪一个更快 ng-if 或 ng-switch？假设我们有一个案例：10 个不同的 div，一次只需要一个。如果用ng-switch代替ng-if，速度有什么区别吗？

如果使用 ng-if，所有元素都将被单独评估，但 ng-switch 是否也一样？

使用角度 1.x

【问题讨论】：

10 格？！这是premature optimisation 的定义。你应该更关心哪一个读起来最好Any fool can write code that a computer can understand. Good programmers write code that humans can understand.
我认为ng-switch 的性能稍好一些，因为它很有可能并非所有值都匹配。因为在 angularjs 中不可能创建 if / else if / else if / else if 子句，所以总是评估所有 if 条件。除此之外，ng-if 和 ng-switch 在范围等方面的行为非常相似。
@Liam 显然这不是我的全部用例。我只是为这个问题简化了它。我得到了可能有数千个元素的中继器，每个元素都包含一些这样的案例。而且我并不期待任何巨大的性能提升。我想知道哪个更好。
更好没有意义？它们有不同的用例。如果您不期望任何巨大的性能提升，您为什么还要烦恼？只需使用读得最好的那个。这是 100% 过早的优化...
因为好奇

标签： javascript angularjs angular-ng-if

【解决方案1】：

ng-if 和 ng-switch 都创建了自己的作用域。所以在这一点上，没有区别。

最后，我认为这在很大程度上取决于用例。

如果您只有几个元素，使用ng-switch 变体可能会更好，因为正如我在评论中所说，ng-switch 有很好的机会避免匹配所有可能的值，因为这是不可能的在 angularjs 中创建一个if / else if / else if / else if 子句。使用 ng-if，所有 if 条件都会被计算。

但是由于 ng-show 使元素在 DOM 中保持活动状态（与 ng-if 相比），这意味着即使用户根本看不到视图，它们的所有 watch 表达式和性能成本仍然存在。在非常大的视图中，这可能会带来惩罚。

【讨论】：

【解决方案2】：

ng-if 本身就是一个 ng-switch，不同之处仅在于 ng-if 只有一个表达式。

所以如果你只有一个表达式，最好使用 ng-if ，否则使用 ng-switch。这是使用它们时唯一需要考虑的事情。

【讨论】：