Necesito implementar el desplazamiento infinito en una aplicación de reacción, mientras que mis datos son enormes y el uso puede seguir desplazándose y desplazándose durante mucho tiempo.

Todas las soluciones de desplazamiento infinito que he encontrado solo manejan agregar los datos a la tabla de desplazamiento completo. Pero también necesito eliminar datos del DOM para evitar que la aplicación se ralentice debido a que decenas de miles de filas se cargan potencialmente después de un tiempo en la aplicación (piense en las redes sociales). Tampoco quiero mantener todos los datos en la memoria y necesito limpiar los datos antiguos mientras me desplazo (hacia arriba y hacia abajo).

Así que básicamente lo que tengo que hacer:

1. Cargue las primeras 100 filas (1 página) a la página
2. Cuando el usuario se desplaza hacia abajo y se acerca al final, carga la página siguiente y agrega al final
3. Cuando la página tiene una gran cantidad de páginas (digamos 5 páginas o 500 filas), comience a eliminar las páginas antiguas de la parte superior cuando el usuario sigue desplazándose hacia abajo.
4. Si el usuario comienza a desplazarse hacia arriba, debemos revertir la funcionalidad: solicite las páginas que eliminamos nuevamente y agréguelas a su lugar en la parte superior

¿Alguien sabe de tal solución? ¿Alguna recomendación sobre cómo abordar esto si necesito construir desde cero?

¡Gracias!