• Stars
    star
    260
  • Rank 157,189 (Top 4 %)
  • Language
    JavaScript
  • License
    MIT License
  • Created over 7 years ago
  • Updated over 4 years ago

Reviews

There are no reviews yet. Be the first to send feedback to the community and the maintainers!

Repository Details

Optimization for complex and slow React Native FlatLists

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: facebook/react-native#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>}
    />
...