-
Book Overview & Buying
-
Table Of Contents
React Application Architecture for Production - Second Edition
By :
When dealing with large data sets, performance can become a bottleneck for both the server and the client. The server must process potentially thousands of records, increasing response time and bandwidth usage. The client must render all those records, which can be slow and memory-intensive, especially on mobile and lower-end devices.
We can address these challenges with two techniques: pagination, which reduces the amount of data transferred, and virtualization, which reduces the number of list items rendered on the page.
Instead of returning all ideas at once, we can implement infinite pagination to fetch a set of ideas, then fetch more ideas as the user scrolls or clicks a "Load More" button. This way, users start with a small, fast-loading set of data and can load more when they need it.

Figure 8.5 – Infinite pagination
React Query provides the useInfiniteQuery hook specifically for this pattern. It manages multiple pages of...