How to Best Handle Large Lists (i.e. Sortable.Grid with 100+ items)

[anultravioletaurora]

Hey Mati!

First off, huge thank you for this module. We at Jellify were looking for a way to build a music player queue that could be reordered, as well as a way to reorder and mutate music playlists. Your library has been a huge UX and DX improvement over the libraries we were using prior

So my question...

Some users of Jellify have really large playlists or really large queues, and we notice that performance takes a hit under those scenarios. For a list of 50 items, react-native-sortables still works, but a list of 100 items causes some performance degradation.

We're already using the React Compiler in Jellify, but is there anything else we can do to better optimize react-native-sortables for large(r) lists?

[iCodePup]

Hi ! Interested as well ! rendering gets slow with large lists :/

[MatiPl01]

Hey! Sorry for the late response. I missed the original question from @anultravioletaurora.

I am planning to work on this feature once I have more time, but, unfortunately, I wasn't able to find time for it yet. It likely won't happen this month as I am finishing the 2nd semester of my Master's studies and I don't have time to think how to best approach the implementation for virtualized lists. I hope to have some time for that in the between-semester break at the beginning of February. Sorry for that 😞.

[anultravioletaurora]

No worries!! Best of luck to you on the Master's 🫡

[iCodePup]

Thanks for the update! Good luck with your Master’s exams :)

[iCodePup]

Hey! Hope your exam went well. Did you find some time to have a look? Thanks a lot ☺️

[MatiPl01]

Hey @iCodePup. Thanks for asking. I was thinking if I can do something quickly but I didn't come up with any easy solution other than the full rewrite of the library which will use a different approach. I didn't start working on it yet, though.