Angular 2 performance IE11 *ngFor

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.

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

enter image description here

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?

Thank you in advance.

1
Leave a Reply

avatar
1 Comment threads
0 Thread replies
0 Followers
 
Most reacted comment
Hottest comment thread
1 Comment authors
Jason Recent comment authors
  Subscribe  
newest oldest most voted
Notify of
Jason
Guest

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:

enter image description here

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

Update:

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