美文网首页React Native学习
React Native高性能大列表组件

React Native高性能大列表组件

作者: _石破天惊_ | 来源:发表于2018-01-11 15:22 被阅读1645次

    前言

    做React Native开发的大都面对这样一个性能问题:使用FlatList或SectionList展示大数据列表时,性能令人很不满意,这也是很多人放弃使用纯React Native开发App的原因之一。今天介绍一个我写的一个优化的大列表组件 react-native-largelist

    github地址: https://github.com/bolan9999/react-native-largelist


    特点

    1. 比官网的FlatList/SectionList CPU和内存占用更少,性能表现更好,在最坏的情况下(比如从第一行直接用代码滑动到第1000行),即使出现白板,也是瞬间消失。

    2. 支持超大数据源,支持无限列表,支持超快速度滑动。

    3. 跨平台,兼容iOS和Android。优化自ScrollView,对RN版本兼容性好。

    4. 支持分组,支持每组头视图自动吸顶,新的Section挂在列表顶部时,支持回调。

    5. 行组件进入或离开安全区域时可配置回调事件。

    6. 支持单独的头部、尾部和空视图。

    7. 支持左右滑动编辑Cell。

    8. 支持下拉刷新和上拉加载更多。

    9. 支持上拉加载视图自定义配置,上拉加载完成自定义视图配置。

    10. 支持获取当前的动态属性,比如视图大小、当前偏移、当前Section、当前滑动视图总大小、头部或尾部组件高度、当前可视行等。

    11. 支持滑动到指定位置或指定行。

    12. 支持数据更新。

    13. 支持自定义优化属性,可根据实际情况修改优化参数提升性能。

    14. 如需要未提供的其他属性或回调事件可以通过提交issue提醒作者添加。

    预览

    性能展示

    可以点击在优酷youtube查看性能展示视频。

    相关文章

      网友评论

      • 千千澈寻:请问如果列表的元素高度不是固定值,怎么解决啊?
      • a281c537b836:这个是不是不能取消悬浮啊。。。
      • 神魔狼:支持底部悬浮么

      本文标题:React Native高性能大列表组件

      本文链接:https://www.haomeiwen.com/subject/dizznxtx.html