Next.js Discord

Discord Forum

Prevent re-rendering after invalidation

Unanswered
Cuvier’s Dwarf Caiman posted this in #help-forum
Open in Discord
Cuvier’s Dwarf CaimanOP
Hey all,

I have a page with a list of postings, which can be voted up or down. The order of the postings is their number of upvotes. The upvote is via a server action that is calling revalidateTag after the successful vote. The current behaviour is, that as soon as I vote (and the vote is resulting in a new order of the list) the page rerenders and the posting is switching its position (eventually out of viewport) which is highly confusing to the user.

There are some other user-actions on that page, that should not be reflected immediatly, but after a manual page load.

Some details: The page has a cached fetch, to get all the IDs of the postings with a thread-$id tag. Each posting gets their data via its own cached fetch with the tag posting-$id. Both tags get invalidated on vote. The thread-fetch gets the postings from the API in the correct order. Currently nearly every component is RSC and just the outer things like the upvote button are small client components.

Some ideas to get what I want? Is there a way to opt out re-rendering the page after invalidation? Is there any next-like way? Or am I missing something completely?

Currently we do this kind of actions with an API-route and a client fetch instead of the server actions...

2 Replies

Cuvier’s Dwarf CaimanOP
ping... 🙂
If you can summarise the message, I'll be able to help you in about 1.5 hrs