https://github.com/st0ffern/react-native-optimized-flatlist

Optimization for complex and slow React Native FlatLists
https://github.com/st0ffern/react-native-optimized-flatlist

flatlist react-native

Last synced: 7 days ago
JSON representation

Optimization for complex and slow React Native FlatLists

• Host: GitHub
• URL: https://github.com/st0ffern/react-native-optimized-flatlist
• Owner: st0ffern
• License: mit
• Created: 2017-05-03T18:25:56.000Z (over 7 years ago)
• Default Branch: master
• Last Pushed: 2020-05-24T20:28:49.000Z (over 4 years ago)
• Last Synced: 2024-05-14T05:02:07.403Z (6 months ago)
• Topics: flatlist, react-native
• Language: JavaScript
• Size: 377 KB
• Stars: 258
• Watchers: 6
• Forks: 46
• Open Issues: 22
• Metadata Files:
  • Readme: README.md
  • License: LICENSE

Awesome Lists containing this project

README

        
# react-native-optimized-flatlist

[![Greenkeeper badge](https://badges.greenkeeper.io/stoffern/react-native-optimized-flatlist.svg)](https://greenkeeper.io/)

![](https://img.shields.io/npm/v/react-native-optimized-flatlist.svg)

__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:

```js

render() {

  return (

   {item.name}}

    />

...

```

With this:

```js

...

import {OptimizedFlatList} from 'react-native-optimized-flatlist'

...

render() {

  return (

   {item.name}}

    />

...

```