{"repo":"researchgate/react-intersection-list","free":true,"listed":false,"github":"https://github.com/researchgate/react-intersection-list","clone":"git clone https://github.com/researchgate/react-intersection-list.git","description":"React infinite scroll using the Intersection <Observer /> API","language":"JavaScript","stars":138,"topics":["infinite-scroll","list","intersection-observer","react"],"license":"MIT","category":"ui-components","readme_excerpt":"⚠️ This repository is not as actively maintained as we wish it to be. Feel free to fork this project and fix any outstanding issues you might have, and we'll try to merge relevant changes eventually. We apologize for the inconvenience. Agent Smith: ...we have no choice but to continue as planned. Deploy the sentinels. Immediately. React Intersection List builds on top of React Intersection Observer , using a sentinel in the DOM to deliver a high-performance and smooth scrolling experience, even on low-end devices. Table of Contents - Getting Started - Why React Intersection List? - Documentation - How to - FAQ - Props - Examples - Contributing Getting Started And optionally the polyfill: Next create a and two instance methods as props children and itemRenderer : Note that is a PureComponent so it can keep itself from re-rendering. It's highly recommended to avoid creating new functions for renderItem and itemsRenderer so that it can successfully shallow compare props on re-render. Why React Intersection List? The approach to infinite scrolling was commonly done by devs implementing throttled scroll event callbacks. This keeps the main thread unnecessarily busy... No more! IntersectionObservers invoke callbacks in a low-priority and asynchronous way by design. Agent Smith: Never send a human to do a machine's job. The implementation follows these steps: 1. Add a sentinel close to the last item in the list 2. Update the list moving the internal cursor 3. Trigger a callback when","default_branch":null,"files":null,"tree":[],"storefront":"/r/researchgate","claimed":false,"request_supported":{"post":"https://gitbuyer.com/r/researchgate/react-intersection-list/request-supported","requests":0},"note":"indexed from public GitHub; nothing is for sale on this page. Clone it from GitHub. Paid listings live at /search."}