react-native-optimized-flatlist

Optimization for complex and slow React Native FlatLists

Downloads in past

Stats

StarsIssuesVersionUpdatedCreatedSize
react-native-optimized-flatlist
1.0.45 years ago5 years agoMinified + gzip package size for react-native-optimized-flatlist in KB

Readme

react-native-optimized-flatlist
Greenkeeper badge
Optimization for FlatLists. This is a fix over the FlatList that removed every item that is not inside the viewport. This will give a more stable and faster FlatList as performance dont drop! :)
Please also read more about the issue here: https://github.com/facebook/react-native/issues/13413

Installation

npm i -S react-native-optimized-flatlist
or
yarn add react-native-optimized-flatlist

Usage

Just replace FlatList with OptimizedFlatList .. thats all! :)
Replace this:
render() {
  return (
  <FlatList
    data={[{name: 'fred', name: 'freddy'}]}
    renderItem={ ({item}) => <View>{item.name}</View>}
    />
...
With this:
...
import {OptimizedFlatList} from 'react-native-optimized-flatlist'

...
render() {
  return (
  <OptimizedFlatList
    data={[{name: 'fred', name: 'freddy'}]}
    renderItem={ ({item}) => <View>{item.name}</View>}
    />
...