Performance issues with react-native-wheel-picker in react-native-bottom-sheet on Android

[zhuscat]

Hello, I'm trying to use react-native-wheel-picker within a react-native-bottom-sheet on Android, and I've encountered some performance issues.

When I use VirtualizedWheelPicker, I notice UI jank when the modal is opened. However, this jank doesn't happen when I switch to WheelPicker. The problem with WheelPicker is that when there are a large number of options (e.g., 1000 items), the modal takes a very long time to appear, and scrolling is extremely laggy.

This is my minimum reproducible example repository: https://github.com/zhuscat/virtualized-wheel-picker-with-bottom-sheet-cause-janky-ui

[rozhkovs]

@zhuscat Thanks for the issue!

Could you provide a video to better understand the problem? It’s likely caused by extra renders of items while the modal is opening. You can experiment with the updateCellsBatchingPeriod and maxToRenderPerBatch parameters; see more details here.