Angular-使用好NgForOf的trackBy带来性能上的提升
官方文档,查看“变更的传导机制”即有详细的表述:
即使数据没有变化,迭代器中的元素标识符也可能会发生变化。比如,如果迭代器处理的目标是通过 RPC 从服务器取来的, 而 RPC 又重新执行了一次。那么即使数据没有变化,第二次的响应体还是会生成一些具有不同标识符的对象。Angular 将会清除整个 DOM, 并重建它(就仿佛把所有老的元素都删除,并插入所有新元素)。这是很昂贵的操作,应该尽力避免。
那么如何来避免呢?
要想自定义默认的跟踪算法, NgForOf支持trackBy选项。trackBy接受一个带两个参数(index和 item)的函数。 如果给出了trackBy,Angular 就会使用该函数的返回值来跟踪变化。
可惜官网提供的例子无法运行,自己来个例子似乎会更好理解: