gpt4 book ai didi

javascript - Angular 性能 - 过滤器与函数表达式

转载 作者:塔克拉玛干 更新时间:2023-11-02 20:57:00 24 4
gpt4 key购买 nike

我有一个关于 Angular 1.x 的性能问题。使用函数表达式与过滤器获取基于键的值是否有任何性能优势?让我用例子来解释。

我目前有一个复杂的 Angular 应用程序,其中包含许多用于获取基于对象键的值的过滤器。我的数据中有很多键/ID 引用,因此我使用过滤器根据键获取字段值。

E.g. {{ ID123 | getField:'object':'field'}}

然后,自定义过滤器将执行异步调用(对数据库)以根据键 (ID123) 获取我指定的对象名称并返回我指定的字段(而不是仅显示键)。

我目前正在做一些性能清理工作,我已经阅读了很多关于避免过滤器的文章,因为它们会影响性能。我正在做的一件事是使用一次性绑定(bind) {{::ID123 | getField:'object':'field'}} 但在某些情况下我不能这样做(因为我需要更新值)。

然后我正在查看函数表达式而不是自定义过滤器,例如{{getField(ID123,'object','field')}}. 但我不确定它是否会获得任何性能优势。

你可以在我比较两者的地方看到我的 plunker 示例。

https://plnkr.co/edit/hlL2LSOGjq5HsImUyqyu?p=preview

会有任何性能优势吗?还有没有办法测试或基准测试两者之间的差异?

谢谢

最佳答案

简答:过滤器最好是幂等的(即相同的输入总是返回相同的输出)并且输入不是对象。


长答案:

如果你使用一个函数,它会在每个摘要循环中被调用,因为 Angular 必须检查输出是否相同。这意味着在显示的数据“稳定”之前它将被调用多次。

如果你使用过滤器并且输入不是对象,它只会在输入发生变化时执行,因为 Angular 假定过滤器是幂等的,除非它们的 $stateful 属性设置为 。对象是一个异常(exception),因为检查对象的深层属性是否发生更改的成本很高,因此 Angular 在每个摘要循环中执行过滤器,使其与函数相同。

创建幂等的自定义过滤器时要小心,Angular 会假设它们是幂等的并且不会正确更新显示的数据。如果您必须创建一个,请将它们标记为 $stateful


来源

这个问题是相关的,并为我指明了正确的方向:
Custom filter vs filter function in controller performance comparison

这是过滤器的 Angular 文档(“执行过滤器时”和“有状态过滤器”部分):
https://docs.angularjs.org/guide/filter

关于javascript - Angular 性能 - 过滤器与函数表达式,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/38063155/

24 4 0
Copyright 2021 - 2024 cfsdn All Rights Reserved 蜀ICP备2022000587号
广告合作:1813099741@qq.com 6ren.com