Super Simple List Virtualization in React with IntersectionObserver

• react-window

  38 15,275 2.6 JavaScript

  React components for efficiently rendering large lists and tabular data

Also, a new IntersectionObserver is created for every element that you wrap in . This does result in some extra performance overhead - especially if there are hundreds or thousands of items. I can scroll through hundreds or thousands of items on my mid-tier smartphone without noticing any degradation, so this hasn't bothered me so far. However if you really need the absolute best performance of any solution, you might be better off using react-window and spending some extra time to get it working with your setup.

• react-virtualized

  40 25,951 1.6 JavaScript

  React components for efficiently rendering large lists and tabular data

Virtualisation is simple in theory, but a bit harder in practice. There are two commonly used React libraries for implementing virtualization - react-window and react-virtualized. Both of these libraries are maintained by Brian Vaughn, who is also a member of the core React team at Facebook.

• SurveyJS

  surveyjs.io sponsored

  Open-Source JSON Form Builder to Create Dynamic Forms Right in Your App. With SurveyJS form UI libraries, you can build and style forms in a fully-integrated drag & drop form builder, render them in your JS app, and store form submission data in any backend, inc. PHP, ASP.NET Core, and Node.js.

  

Suggest a related project