Infinite scrolling list using lazy Turbo Frames

11642
0

Turbo Frames can implement infinite scrolling without a JS router. I render the first page normally and append a “next page” frame at the bottom with loading: :lazy. When the user scrolls and the frame enters view, Turbo fetches the next page automatically. The server returns only the list items plus another next-page frame if there’s more. This keeps pagination semantics intact (you can still use ?page=2), and it works nicely with caching since each page is a distinct response. The main gotcha is to ensure the lazy frame has a stable id (like next_page) and that the response includes a frame with the same id.