Infinite Scrolling to Detail View and Back

[taekyeomlee]

I'd like to share my experience and examples.

• A List Page: This page features infinite scrolling combined with list virtualization
• A Detail Page: Upon selecting an item from the list, users are taken to this page to view more detailed information.

The primary challenge was maintaining the scroll position when a user selects an item on the list page, navigates to its detail page, and then returns.

Third-Party Integrations

• @tanstack/react-query 5.29.0 (for Infinite Scrolling)
• react-router-dom 6.22.3 (for Page Routing)
• recoil 0.7.7 (for Scroll Position Management)

Feel free to adjust the libraries according to your project's specific needs.

codesandbox