How to make a SectionList preload data to make it seem to the user the data is not loading

Question

I am trying to improve my section list to make it seems to the user that there is no loading or paginating involved in the list. The idea is to when the user scroll down the list to never stop or show a loading component but just continue to fetch data without the user noticing. Is that achievable?

Here is my current component code.

<SectionList
          sections={homeMatches?.pages
            .reduce((acc, {matches}) => {
              acc.push(matches);

              return acc;
            }, [])
            .flat()}
          keyExtractor={(item, index) => item + index}
          refreshControl={
            <RefreshControl refreshing={isLoading} onRefresh={refetch} />
          }
          renderItem={({item}) => (
            <LeagueMatch
              isFocused={isFocused}
              match={item}
              showDate={true}
              isHome={true}
              isTeamMatch={isTeamMatch}
              useUri={true}
              onPress={() => {
                navigation.navigate('Match', {
                  match: JSON.stringify(item),
                });
              }}
            />
          )}
          renderSectionHeader={({section}) => (
            <HomeLeagueItem
              team={section}
              isTeamMatch={false}
              isTeam={false}
              onPress={() => {
                navigation.navigate('League', {league: section});
              }}
            />
          )}
          onEndReached={loadMore}
          ListFooterComponent={isFetchingNextPage ? renderSpinner : null}
        />