您当前的位置: 首页 >  react native

xiangzhihong8

暂无认证

  • 1浏览

    0关注

    1324博文

    0收益

  • 0浏览

    0点赞

    0打赏

    0留言

私信
关注
热门博文

React Native组件之VirtualizedList

xiangzhihong8 发布时间:2018-07-06 17:13:41 ,浏览量:1

React Native(简称RN)列表是基于ScrollView实现的,也就是可以滚动的,然而RN并没有直接使用IOS或Android的原生列表组件,这是因为RN真正调用native代码的过程是异步的,二Native的渲染要求必须同步渲染的。

在早期版本中,对于列表情况RN采用的是ListView组件,和Android一样,早期的ListView组件性能是非常的差的,在后来的版本中,RN提供了系列用于提高列表组件性能的组件:FlatList和SectionList。FlatList和SectionList都是基于VirtualizedList实现的。

读者可以在项目的“node_modules/react-native/Libraries/Lists/XXX”文件夹下找到相关的源码。一般来说,FlatList和SectionList已经能够满足常见的开发需求,仅当想获得比FlatList 更高的灵活性(比如说在使用 immutable data 而不是普通数组)的时候,才会应该考虑使用VirtualizedList。

VirtualizedList

VirtualizedList通过维护一个有限的渲染窗口(其中包含可见的元素),并将渲染窗口之外的元素全部用合适的定长空白空间代替的方式,极大的改善了内存消耗以及在有大量数据情况下的使用性能(类似于Android的ListView的界面复用机制)。

当一个元素离可视区太远时,它的渲染的优先级较低,否则就获得一个较高的优先级,VirtualizedList通过这种机制来提高列表的渲染性能。在使用VirtualizedList赢注意以下几点:

  • 当某行滑出渲染区域之外后,其内部状态将不
关注
打赏
1482932726
查看更多评论
立即登录/注册

微信扫码登录

0.0591s