The infinite scroll feature has existed for a while. It’s a great way to enhance your application’s UX. In the infinite scroll, new content is loaded as you scroll down the page. When you get the bottom of content, then web page loads new content and appends it to bottom. A familiar example could be Facebook, you are presented with feed of posts and images. And as you scroll down, more posts showing up. Timelines or feeds are best suited for infinite scrolls. There are many third-party libraries available. So here are 15 React Infinite Scroll Components for simple way of implementing infinite scrolling.
React components for efficiently rendering large lists and tabular data. React Virtualized has very few dependencies and most are managed by NPM automatically. However the following peer dependencies must be specified by your project in order to avoid version conflicts: react, react-dom. NPM will not automatically install these for you but it will show you a warning message with instructions on how to install them.
Infinitely load content using a React Component. This fork maintains a simple, lightweight infinite scroll package that supports both window and scrollable elements.
React standard library – must-have toolbox for any React project.
Infinite scrolling date-picker built with React, with localization, range selection, themes, keyboard support, and more.
A versatile infinite scroll React component.
An awesome Infinite Scroll component in react. A component to make all your infinite scrolling woes go away with just 4.15 kB! Pull Down to Refresh feature added. An infinite-scroll that actually works and super-simple to integrate!
Another react infinite scroll package.
A module used to arrange card elements including content infinitely according to layout type. With this module, you can implement various layouts composed of different card elements whose sizes vary. It guarantees performance by maintaining the number of DOMs the module is handling under any circumstance
InfiniteLoader component inspired by react-virtualized but for use with react-window.
react infinite grid is a React component which renders a grid of React elements. It’s different because it only renders the elements that the user can see (and a small buffer) meaning that it is well suited for displaying a large number of elements.
Very simple React.js component for masonry grid. Based on Bricks.js, React Infinite Scroller and React Masonry Layout. Component is mostly suitable for static data, but can be used with dynamic with instance methods.
A brutally simple react infinite scroll component.
A browser-ready efficient scrolling container based on UITableView. When a long list of DOM elements are placed in a scrollable container, all of them are kept in the DOM even when they are out the user’s view. This is highly inefficient, especially in cases when scrolling lists can be tens or hundreds of thousands of items long. React Infinite solves this by rendering only DOM nodes that the user is able to see or might soon see. Other DOM nodes are clustered and rendered as a single blank node.
React component to manage infinite list with the IntersectionObserver API.
A simple hook to create infinite scroll list components.