Angular 2性能IE11 * ngFor [英] Angular 2 performance IE11 *ngFor

问题描述

我正在尝试Angular 2，并且我注意到使用* ng循环超过1500个项目时，Internet Explorer 11的性能显着降低. IE11大约需要25秒，而其他浏览器则不到1秒.

I'm trying Angular 2 and I noticed that performance on Internet Explorer 11 is dramatically slow while cycling with *ngFor over 1500 items. It takes about 25sec with IE11 whereas less then 1sec on other browsers.

暂停调试器我注意到代码在es6-shim.js中不断调用 isNan 函数. 这里是调用堆栈:

Pausing the debugger I noticed that the code constantly calls isNan function in es6-shim.js. Here the call stack:

此处有效的plnkr: http://plnkr.co/edit/sEujClHmuCbrydIiYQYL?p=preview . 代码很简单:

A working plnkr here: http://plnkr.co/edit/sEujClHmuCbrydIiYQYL?p=preview . The code is very simple:

<ul *ngFor="#item of items">
    <li>Item: {{item.itemKey}}</li>
</ul>

//Load items simulating remote load
setTimeout(function(){
  for (let i = 0; i < 1500; i++) {
          self.items.push(new Item(i+""));
      }
},1000);

有人遇到同样的问题吗?有什么变通办法或技巧来提高性能?

Anyone with the same issue? Any workaround or tip for improving performance?

谢谢.

推荐答案

问题是IE没有Map的本机实现. polyfill的set和get函数非常慢(与它们的本机对应函数相比)，并且花费了大部分时间:

The problem is that IE has no native implementation of Map. The set and get functions of the polyfill are extremely slow (compared to their native counterparts) and take most of the time:

也许-或希望-其他Map的polyfill比es6-shim快.

Maybe - or hopefully - other polyfills for Map are faster than es6-shim.

更新:

我已经使用 core-js 及其代码测试了您的代码性能似乎更接近于本机实现.

I have tested your code with core-js and its performance seems to be much closer to that of the native implementation.

这篇关于Angular 2性能IE11 * ngFor的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！