Angular 2 performance IE11 *ngFor

Question

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:

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.

Answer 1

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:

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.