当前位置: 动力学知识库 > 问答 > 编程问答 >

Angular2 terrible performance with ngFor assigning variable to "index"

问题描述:

Consider the following 2d array:

myLabels = [[45, 56, 63],

[31, 67, 27],

[89, 23, 61]]

Now in a template, iterate over this array like:

<template ngFor let-row_ [ngForOf]=myLabels let-i="index">

<template ngFor let-labelid [ngForOf]=row_ let-j="index">

...

</template>

</template>

When I increase my array to something larger, the performance tanks pretty hard. A modestly-sized 40x40 array takes almost 40 seconds to render with Chromium 50. It's a little faster on Firefox 47, but not by much.

If I eliminate the index assignments (let-i="index"...), then the performance is just fine

<template ngFor let-row_ [ngForOf]=myLabels>

<template ngFor let-labelid [ngForOf]=row_>

...

</template>

</template>

So, the question is, what can be done to mitigate this issue? Is there something that I'm missing regarding ngFor? Is there a different way?

网友答案:

Did you try to change your change detection strategy to: ChangeDetectionStrategy.OnPush ?

Also, consider creating Immutable arrays.(See immutable.js)

Check this article: http://jvandemo.com/how-i-optimized-minesweeper-using-angular-2-and-immutable-js-to-make-it-insanely-fast/

分享给朋友:
您可能感兴趣的文章:
随机阅读: