Carousel with dynamic data

I’m using your carousel project. I wanted to bind 1000 items to carousel. My code works, but when i update state of carouselData, app is waiting almost 10 seconds. This wait is so long for user experience. And carousel strange behaviour. Like this video. I want to pass one by one. How can i fast update data. I bind data like this on onSnapToItem event:

<Carousel
             ref={(c) => { this.carousel = c; }}
             data={this.state.carouselData}
....
 onSnapToItem={(index) => {
    if(index%4==0)
    {
          const lastArr = this.arrContent.slice(index + 1, index + 6);
          this.setState({
                           carouselData: [...this.state.carouselData, ...lastArr]
           });
     }
}

[SaraChicaD]

The issue I’m getting with dynamic data is that I’m trying to always have a set of 3 items, swap out the first and last, but then Carousel never recognizes that there are more than 3 items in the array.

Does anyone have an example of how they solved this or got around it?

So I have this: data = [first, second, third] and I have logic that’s constantly updating all three images, but the Carousel will only ever let me swipe to the 3 items.

[bd-arc]

@egvrcn You’re welcome! Thanks for the feedback on shouldComponentUpdate by the way.

I’m going to close the issue because there is only so much we can do about it. Let’s follow FlatList’s evolution closely and post any meaningful update to this thread 😉

I’ll make sure to add everything we’ve shared so far to the doc; it can prove useful for other users.