Infinite Scroll Feed
Endless content that doesn't break the back button.
IntermediateWeb appUI component10–20hAI-buildable 4/5no setup
Infinite scroll done responsibly: cursor pagination, scroll position restoration when you navigate away and back, and a keyboard-reachable load-more fallback. The restoration problem is the one nearly every implementation gets wrong.
UI
Logic
Useful
Hosting · Free forever
Deploys free on GitHub Pages, Cloudflare Pages or Vercel Hobby.
Deploy it and share a link.
Core features · 7
- Pages load as the sentinel enters the viewport
- Cursor-based pagination avoids duplicates and gaps
- Scroll position restores when returning from a detail view
- A visible load-more button provides a keyboard-accessible path
- Loading, error and end-of-feed states are all distinct
- Failed page loads can be retried without losing what's loaded
- Newly arrived items don't shift content under the reader
The interesting part
- Restoring scroll position when content loads asynchronously
- Preventing layout shift as images resolve
- Infinite scroll is an accessibility problem without a real alternative path
Once it works
- Add windowing so the DOM doesn't grow unbounded
- Add a new-items-above indicator
- Add optimistic interactions on feed items
Suggested stack
reacttypescripttailwindtanstack-query