react-native-optimized-flatlist icon indicating copy to clipboard operation
react-native-optimized-flatlist copied to clipboard

Warning still alive

Open vendramini opened this issue 8 years ago • 0 comments

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!

vendramini avatar Dec 27 '17 19:12 vendramini