巨大列表中的 NativeScript virtualScroll

NativeScript virtualScroll in huge list

之前我在跨平台应用程序中使用 Ionic。使用 Angular repeat 时,大型列表中存在性能和内存问题。

但是 ionic 有一个叫做 virtualRepeat 的特性(或 v1.x 中的 collection-repeat)。但是BUG很多,不能用

NativeScript有这样的功能吗? (它不能让所有元素都在列表中保持活动状态,并且随着用户滚动更改列表。)React Native.

中提供了相同的功能。

我还拍了个截图视频做性能演示。起初我有 20 件物品。然后为了在滚动中加载更多,我加载了一个非常大的列表。然后,查看结果:

https://www.youtube.com/watch?v=220FS2SqLqI

在 Nativescript 中,您将希望使用 ListView 而不是 ngFor 或其他重复技术,Listview 重用视图并减少大列表的内存使用

示例

<ListView [items]="myItems">
   <template let-item="item">
       <StackLayout>
          <Label [text]='item.name'></Label>
       </StackLayout>
    </template>
</ListView>

Link 与 docs/more 示例:

https://docs.nativescript.org/angular/ui/list-view.html

最后我发现,它使用了虚拟化。我 运行 这个命令:

tns debug android

然后我可以从 chrome 开发工具中看到元素:

它只使用了几个元素,滚动时会改变它们。