React-native-snap-carousel: Does it render all items at once?

[grundmanise]

Hi,
does this component render all items at once or only visible items are rendered?
does it support removeClippedSubviews prop of ScrollView?

[bd-arc]

@grundmanise Hi! For now, all items are rendered at once. But we are currently working on implementing a preload prop that will allow rendering only the current item as well as a specific number of the previous and next ones. Stay tuned!

As for your other question, and as stated in our README, you can use any prop from the original ScrollView component. Actually, we totally recommend activating the removeClippedSubviews prop when your scroller doesn't need to handle too many items since this really enhances scroller's performance.

[cinder92]

any update about this?

[bd-arc]

Hey @cinder92,
Yes, I confirm that we are still working on it. It's taking some time though, because this requires a lot of refactoring and miscellaneous solutions are tested. FYI, we are currently considering using the new <FlatList /> component.

[fendorio]

Hey there, nice repo - I've just been checking it out on IOS.

Quick question for anyone a bit more knowledgable on this project.

In the meantime, is the workaround for this to watch the current index of the slide and utilise some AJAX logic to go fetch more items / populate the carousel with more items which are stored in the apps memory but just not rendered yet?

Hope that makes sense

[bd-arc]

@fendorio Yes, you could totally do that to provide some sort of infinite scroll. You can use onSnapToItem to check if you've reached the last slide, fetch some more items and update your state.

Note that we haven't tested this use case yet, but since our plugin supports dynamic slides, you should be able to easily implement it.

[PublicParadise]

@bd-arc: I do like react-native-snap-carousel. But unfortunately I can't use it. It just breaks down at around 2000 items. Render time balloons to 10s. Would you guys be interested in creating an experimental branch exploring that <FlatList/> idea? That's the only way to solve my performance problem with the current version of react-native-snap-carousel. I'd be willing to chip in and push PRs if needed.

Thanks for considering!

[bd-arc]

Hi @PublicParadise,
I understand your concern but, as stated here, <FlatList /> is shipped with bugs that are really problematic for our most common use cases.

To be honest, we've never thought that it would be used to display that many items. May I ask you to provide a bit more context?

Still, we're open to go with your suggestion and experiment on a dedicating branch. I'll push my own developments as soon as I have something stable ;-)

[PublicParadise]

Hi @bd-arc,

my use case is a real estate app that shows pictures of properties - similar to what Trulia does. Another use case would a simple photo album. In these days 2000 photos is nothing!

This is an interesting topic. Let me mover over to https://github.com/archriss/react-native-snap-carousel/issues/73. That seems to be the right place for this discussion.

[bd-arc]

Hi guys,

Great news: the FlatList implementation is finally here for you to try!

Take a look at the flatlist branch that features a Carousel more performant than ever, an updated README and an updated example.

I'm closing this issue since it's better if the follow-up discussion takes place in #73. Make sure to let me know what you think ;-)