Estoy usando la biblioteca react-infinite-scroll-component para implementar la función de desplazamiento infinito y luego estoy mapeando 10 videos a la vez después de que se mapeen aproximadamente 50 videos, mi navegador se bloquea. ¿Hay alguna forma de arreglar esto? Estoy tratando de implementar una función similar a tiktok en mi sitio web.

Esta es mi función de mapa donde mapeo un reproductor de video

 {data.map((items,i)=>{ return ( <VideoPlayerShorts loop={true} sources={[ { src: items.video_details.trim_video_link, type: "application/x-mpegURL", }, ]} />

Esta es mi función de desplazamiento infinito

 <InfiniteScroll dataLength={data.length} next={getMoreData} hasMore={hasMore} > </InfiniteScroll>