Infinite Scroll

Infinite scroll is common in feeds, product lists, and masonry image grids. The page loads a first batch of data (say, 20 items). As the user gets close to the bottom, the frontend fetches the next page and appends it to the end of the list. To detect "almost at the bottom," you usually use IntersectionObserver to watch a placeholder element at the end of the list.

It's easy to confuse with Lazy Loading. Infinite scroll keeps "appending new data." Lazy loading means images or modules already on the page "wait until you scroll near them before loading their resources." The two are often used together.

Infinite scroll fits content people just browse and don't need to pinpoint. Admin tables, where people jump to page 5 or come back to find a specific row, work better with pagination. The bottom of the list needs to handle three states: loading, no more items, and failed to load with click to retry.