github ankeetmaini/react-infinite-scroll-component v7.1.0
v7.1.0 - IntersectionObserver rewrite

8 hours ago

What's new

IntersectionObserver-based triggering

next() is now fired by an IntersectionObserver watching an invisible sentinel div at the end of the list, instead of a throttled scroll event listener. IO runs off the main thread and requires no throttling, scripting overhead drops from ~29% to ~23%.

Zero runtime dependencies

throttle-debounce has been removed. The package now ships with no runtime dependencies.

Function component rewrite

The class component has been fully replaced with a function component using useRef/useEffect/useState. The public API is unchanged.

Bug fixes

  • Inverse scroll: sentinel is now always the last DOM child. In a flex-direction: column-reverse container this places it at the visual top, so next() fires at the correct threshold as the user scrolls up rather than requiring a full scroll to the opposite end.
  • onScroll prop type: corrected from MouseEvent to UIEvent.
  • scrollableTarget prop type: corrected from ReactNode to HTMLElement | string | null.

Build tooling

  • Rollup 1 → 4
  • TypeScript 4 → 5
  • Rollup plugins migrated to @rollup/* scoped packages

Notes

  • scrollThreshold: semantics are unchanged (0.8 = 80% threshold, "200px" = fixed pixel pre-trigger). Internally this now maps to IO rootMargin rather than a scroll position calculation.
  • Inline function props: passing next or refreshFunction as inline arrow functions no longer causes the observer to reconnect on every render. Stable callback refs are used internally.
  • Graceful degradation: if IntersectionObserver is unavailable, the component renders silently without triggering next(). No error is thrown.
  • SSR / Next.js: safe to render server-side. The IO guard (typeof IntersectionObserver === 'undefined') prevents any server-side attachment.
  • React 18 StrictMode: double effect invocation is handled correctly. The observer is disconnected on cleanup and will not fire duplicate next() calls.

Upgrading

No prop changes. Drop-in replacement for v7.0.0.

Don't miss a new react-infinite-scroll-component release

NewReleases is sending notifications on new releases.