react-native-optimized-flatlist
react-native-optimized-flatlist copied to clipboard
Warning still alive
VirtualizedList: You have a large list that is slow to update - make sure your renderItem function renders components that follow React performance best practices like PureComponent, shouldComponentUpdate, etc.
This warning still after installing this library. My context is the following: whenever I reach the end of the list I call the server to update my reducer, then update the list. Simple as that.
<OptimizedFlatList
data={history.orders_ids}
extraData={history}
keyExtractor={(item, index) => index}
renderItem={orderId => <FlatListItem order={history.orders[orderId.item]} history={history} onPress={this.onPressOrder.bind(this, orderId.item)} state={this.props.state} />}
ItemSeparatorComponent={() => <FlatListItemSeparator/>}
onEndReached={this.onEndReached.bind(this)}
onEndReachedThreshold={0.2}
/>
Where history.orders_ids = [1, 2, 3, etc] and I do have history.orders which is an object like:
{
1: {id: 1, name: 'Test1', ...otherProps},
2: {id: 2, name: 'Test2', ...otherProps},
etc
}
My <FlatListItem/>:
class FlatListItem extends PureComponent {
render() {
const {onPress, order, history} = this.props;
return(
<TouchableOpacity onPress={onPress}>
{/*views, images, etc*/}
</TouchableOpacity>
);
}
}
Am I doing something wrong?
Thanks!