# Preface

I have a page that fetches data in a server-component fashion with a table that supports pagination.
This page also has a fetch function that revalidates every N seconds

The pagination component is a client-side one that uses useRouter() replace (or push, i've tried both), to update a search param (?page=X) whenever the user presses either "Previous" or "Next".

It seems like there's some browser caching happening because for ex; If we're in Page 1 and press "Next" 4 times, it does fire 4 calls and updates the UI correctly.
However pressing "Back" does not fire any request and reuses the "old" information I suppose (that must be a default browser caching strategy?)

# The problem

User loads the page and gets fresh data
User presses "next" a couple of times to navigate the table.

Important --> Revalidation happens on the server.

Now if the user presses "next" he will see the new data.
However pressing "previous" will show him the old data (since it didn't fire off any request).

--

According to the useRouter documentation (https://nextjs.org/docs/app/api-reference/functions/use-router#userouter) I don't see replace/push receiving any parameters to override this behaviour.

Any ideas?