Turbo Streams and Rails Pagination: Binding query limits to incremental updates

Answer

Pass the pagination value (page number or signed cursor) as a normal request parameter in the URL or form data of the Turbo Stream link. The controller reads params[:page] or params[:cursor] and feeds it to the paginator or a manual limit/offset query, so the database stays bounded.

Offset‑based pagination (page/per_page)

1. Add a helper method in the controller that builds the relation with limit and offset:

# app/controllers/posts_controller.rb

def index
  page = params[:page].to_i > 0 ? params[:page].to_i : 1
  per  = params[:per_page] || 20
  @posts = Post.order(:id).offset((page - 1) * per).limit(per)
  respond_to do |format|
    format.turbo_stream   # renders index.turbo_stream.erb
    format.html
  end
end

1. In the Turbo Stream partial render a “Load more” link that includes the next page number and the data-turbo-action="advance" attribute:

<!-- app/views/posts/index.turbo_stream.erb -->
<%= turbo_stream.append "posts" do %>
  <%= render @posts %>
<% end %>
<%= link_to "Load more",
            posts_path(page: params[:page].to_i + 1, per_page: params[:per_page]),
            data: { turbo_action: "advance" },
            class: "btn" %>

Cursor‑based pagination (signed token)

1. Create a verifier in an initializer (or use Rails' built‑in MessageVerifier):

# config/initializers/cursor_verifier.rb
CursorVerifier = ActiveSupport::MessageVerifier.new(Rails.application.credentials.secret_key_base)

1. Helper to encode/decode the cursor (last ID):

# app/helpers/cursor_helper.rb
module CursorHelper
  def encode_cursor(last_id)
    CursorVerifier.generate([last_id].to_json)
  end

  def decode_cursor(token)
    data = CursorVerifier.verify(token)
    JSON.parse(data).first rescue nil
  end
end

1. Controller action uses the decoded cursor to fetch the next batch:

def index
  per = params[:per_page] || 20
  if params[:cursor].present?
    last_id = CursorHelper.decode_cursor(params[:cursor])
    unless last_id
      head :bad_request and return
    end
    @posts = Post.where("id > ?", last_id).order(:id).limit(per)
  else
    @posts = Post.order(:id).limit(per)
  end
  respond_to do |format|
    format.turbo_stream
    format.html
  end
end

1. In the Turbo Stream response render the items and a new “Load more” link that carries the cursor of the last returned record:

<%= turbo_stream.append "posts" do %>
  <%= render @posts %>
<% end %>
<% if @posts.any? %>
  <%= link_to "Load more",
            posts_path(cursor: encode_cursor(@posts.last.id), per_page: params[:per_page]),
            data: { turbo_action: "advance" },
            class: "btn" %>
<% end %>

Verification steps

• Click a “Load more” link and check the Network tab: the XHR request should contain the correct page or cursor parameter and return only the next batch.
• For cursor pagination, tamper with the token value; the server should raise ActiveSupport::MessageVerifier::InvalidSignature (or return 400) and not expose data.
• Run EXPLAIN ANALYZE on the generated SQL to confirm a LIMIT clause (or WHERE id > ?) and absence of a full table scan.

If you are using a different pagination gem (e.g., Kaminari or WillPaginate), replace the manual limit/offset with Post.page(params[:page]).per(params[:per_page]); the same parameter passing applies.