Pagination

Pagination in Bubble is the way you control how many records a repeating group shows at one time. Instead of loading all records at once, users move through them in pages or by scrolling.

Without pagination, Bubble loads every matching record into the browser at once. For large datasets this is slow, expensive in terms of memory, and bad for users who have to scroll through hundreds of rows.

Key Takeaways

• Built into repeating groups: Bubble's repeating group element has native pagination settings built directly into its properties.
• Improves performance: Showing fewer records at a time reduces data load and speeds up your app significantly.
• Two main styles: You can use numbered pages with Previous/Next buttons or infinite scroll for a continuous feed-style experience.
• Works with search constraints: Pagination applies after your search constraints, so you still filter correctly before paginating.

What is Pagination in Bubble?

Pagination in Bubble is a repeating group setting that limits how many records are displayed per page. Users navigate between pages using buttons that trigger "Show previous" and "Show next" workflow actions, or scroll past the last row to load more with infinite scroll.

Every Bubble app that shows lists of data needs a pagination strategy. The right one depends on your use case.

• Fixed-page pagination: Users click Next and Previous to move through a fixed number of records per page, like 10 or 20.
• Infinite scroll: The repeating group loads more records automatically as the user scrolls to the bottom of the list.
• Load more button: A manual "Load more" button gives users control over when additional records are fetched.

Pagination is one of the clearest ways to show users that your app handles data thoughtfully.

How Pagination Works in Bubble

Bubble's repeating group has a "number of rows" or "list entries per page" setting. Set this to your page size. Then create buttons with "Show previous repeating group items" and "Show next repeating group items" workflow actions to let users navigate between pages of results.

Setting up basic pagination in Bubble takes only a few minutes once you know the workflow actions.

• Set page size: In the repeating group's layout settings, limit the number of rows shown at once to your chosen page size.
• Next button workflow: Add a "Show next repeating group items" action to a button to move the user forward one page of results.
• Previous button workflow: Add a "Show previous repeating group items" action to a separate button for backwards navigation.

Bubble's repeating group documentation covers all the built-in pagination options available to you.

Why Pagination Matters for No-Code Apps

Pagination matters because loading thousands of records at once is slow for users and expensive for your Bubble app's server capacity. Showing 10-20 records at a time keeps pages fast, reduces memory usage, and gives users a more manageable browsing experience.

Performance and usability both improve significantly with proper pagination.

• Faster load times: Smaller data fetches mean the repeating group populates faster, making your app feel more responsive.
• Lower memory use: Limiting records per page keeps your Bubble app well within its plan's memory limits under real traffic.
• Better usability: Users navigating a list of 500 records prefer moving through clear pages over scrolling endlessly.

Apps that load quickly retain users. Apps that take three seconds to populate a list lose them before they even start.

Infinite Scroll vs. Page Buttons in Bubble

Infinite scroll loads more records as the user scrolls down, giving a social-feed-style experience. Page buttons give users explicit control over navigation. Choose infinite scroll for content feeds and page buttons for data tables, search results, and admin views where users need to find specific records.

The right style depends on how your users interact with the list.

• Infinite scroll use cases: Social feeds, activity streams, and content discovery work well with infinite scroll loading.
• Page button use cases: Search results, user lists, transaction histories, and admin tables work better with clear page navigation.
• Hybrid approach: Some apps use a "Load more" button that adds records to the existing list rather than replacing them, balancing both styles.

Matching your pagination style to the mental model of your users makes the experience feel natural without any instruction needed.

Conclusion

Pagination in Bubble is a fundamental part of building any app that displays lists of data. Getting it right from the start keeps your app fast, your server costs reasonable, and your users happy. At LOW/CODE Agency, we treat pagination as a performance requirement, not an afterthought, and it is part of every Bubble app we deliver for our 450+ clients.

Frequently Asked Questions

How do I add pagination to a repeating group in Bubble?

Set a row limit in the repeating group's settings, then add buttons with "Show next" and "Show previous" repeating group workflow actions.

What is the best page size for a Bubble repeating group?

10 to 25 records per page is a common range. The right number depends on record complexity and how quickly each row loads.

Does Bubble support infinite scroll in repeating groups?

Yes. Set the repeating group to "Ext. vertical scrolling" and configure how many records to load on each scroll trigger.

Does pagination in Bubble work with search filters?

Yes. Pagination applies after your search constraints, so filtered results are paginated correctly based on the filtered set.

Can I show the current page number in a Bubble repeating group?

Not natively. You can track the current page number using a custom state that increments with each Next button click.

Does limiting repeating group rows improve Bubble app performance?

Yes, significantly. Fetching fewer records per render reduces database load, server memory use, and page load time.