一、定义以及用途
在开发过程中会遇到list、grid的item过多的情况。例如某些新闻类、某些购物类的页面,如果我们有大量的数据,直接通过ForEach进行全量渲染会直接把手机卡死。这样肯定是不行的,这个时候LazyForEach就该登场了。
LazyForEach主要是用来针对列表数据量大、列表组件复杂的场景,减少了页面一次性加载数据的时间消耗,减少了内存峰值。可以显著提升页面的能效比和用户体验。实现原理就是它会从提供的数据源中按需迭代数据,并在每次迭代过程中创建相应的组件。当在滚动容器中使用了LazyForEach,框架会根据滚动容器可视区域按需创建组件,当组件滑出可视区域外时,框架会进行组件销毁回收以降低内存占用。(根据原生开发思想,就是cell的复用机制,绘制可见区域,超过屏幕后回收,新出现的优先使用复用池的cell)。通过lazyForEach来进行性能的优化或者在APP启动的页面采用这个方案也提升了APP的启动(这也算是项目的一个小优化了😄)。
二、使用限制
当开发时遇到列表数据较长,一次性加载所有的列表数据创建、渲染页面产生性能瓶颈时,开发者应该考虑使用数据LazyForEach懒加载。
如果列表数据较少,数据一次性全量加载没有性能问题时,可以直接使用ForEach。
LazyForEach懒加载API提供了cachedCount属性,可以通过设置缓存列表项数量。除默认加载界面可视部分外,还可以加载屏幕可视区外指定数量(cachedCount)的缓存数据。系统默认的cachedCount为1。我们在开发的时候可以默认缓冲一屏幕的数据,来优化用户体验。
以下图片截选自官网
三、API使用
首先,需要我们定义类来实现IDataSource接口方法,直接拷贝官网的就可以了,如下
export class BasicDataSource implements IDataSource {
private listeners: DataCh