Different Pagination Types

In this post, we will learn about the different types of pagination like:

• Offset-based pagination
• Cursor-based pagination
• Infinite scroll pagination

Offset-based pagination (Page based pagination)

The most traditional approach where you specify how many items to skip and how many to retrieve.

// API call example
GET /api/users?offset=20&limit=10

// or
GET /api/users?page=3&per_page=10

offset is the number of items to skip and limit is the number of items to retrieve.

Pros

• Simple to understand and implement
• Allows users to jump to any page directly
• Gives a clear sense of the total dataset size and user's position within it.

Cons: Data can shift if new items appear (not stable for real-time feeds)

Use case: Admin dashboards, tables, lists.

Cursor-based pagination

A more modern approach where you specify a cursor (usually a timestamp or ID) instead of offset and retrieve items after that cursor.

• Request

// API call example
GET /api/users?cursor=1234567890

• Response

{
  "items": [...],
  "nextCursor": "cursorXYZ", // The cursor to get the next page
  "hasNext": true,
  "prevCursor": "cursor123" // The cursor to get the previous page
}

cursor is the pointer to start from.

Pros

• More efficient than offset-based pagination for large datasets
• It provides stability when data changes dynamically because it doesn't rely on static offsets.

Cons

• Harder to implement
• Requires the client to store the cursor and manage it
• Can be less intuitive for users

Use case:

• Social media feeds
• News feeds
• Chat applications
• Live updates
• Any application where the data is updated frequently

Summary

• Offset-based pagination is the most popular with maintaining two parameters offset - starting point and limit - number of items per page. It is easy to implement but can be inefficient for large datasets.
• Cursor-based pagination is more efficient and stable for real-time feeds. It uses a cursor pointer to start from and retrieves items after that pointer. It is harder to implement but provides stability when data changes dynamically.