PagerView renders all the pages and not considering the value provided to offscreenPageLimit

[kavinraju]

Environment

node v18.19.1
react v18.2.0
react-native v0.73.4
react-native-pager-view v^6.3.0

Description

I use PagerView to achieve ViewPager equivalent in Android. Even after I provide value to the prop offscreenPageLimit all the pages are getting rendered on UI. This makes multiple API calls from all the screens, which makes the application to use more memory as I do manage files by downloading them and also make the application slow. In Android PagerView is dead slow, where it takes at least 5 to 10 seconds to respond. Due to confidentiality I won't be able to share the screenshots or screen recordings. But I would be able to share the similar code to reproduce this bug.

Reproducible Demo

Code used:

<PagerView
    ref={pagerViewRef}
    initialPage={currentPosition}
    useNext={false}
    style={styles.pagerContainer}
    offscreenPageLimit={1}
    keyboardDismissMode={'on-drag'}
    onPageSelected={(e) => {
      const position = e.nativeEvent.position;
      setCurrentPosition(position);
    }}
  >
    {filteredList.map((model, key) => (
      <View key={key}>
        {renderTabScreen(model)}
      </View>
    ))}
 </PagerView>

In code you may replace the following as per your wish, renderTabScreen(mode) returns a JSX element. The main idea is that number of pages that's initially loaded into memory to display should be equal to the value provided to the offscreenPageLimit prop, but on observing all the n-pages are getting rendered.

[MrRefactor]

Please provide a repro repository