Are server components a bad idea for my project?
Unanswered
Pollock posted this in #help-forum
PollockOP
Hello all!
I was trying to follow the nextjs paradigm of using server components as much as possible, but I've been struggling for a few days now to make it work.
My problem is my data isn't updated when I go back to the previous page. I've tried a multitude of different tweaks to get the server component to work without success.
I'm tempted to go back to client components and useEffect
I've included a screenshot to show my general approach to fetch data.
https://github.com/KenKot/the-odin-companion?search=1
https://the-odin-companion.vercel.app/
I was trying to follow the nextjs paradigm of using server components as much as possible, but I've been struggling for a few days now to make it work.
My problem is my data isn't updated when I go back to the previous page. I've tried a multitude of different tweaks to get the server component to work without success.
I'm tempted to go back to client components and useEffect
I've included a screenshot to show my general approach to fetch data.
https://github.com/KenKot/the-odin-companion?search=1
https://the-odin-companion.vercel.app/
9 Replies
It is true that there are many problems with caching on Next.js. Even though it would be fixed and server component might be better in long terms, just go with client components if you’re tired with struggling with that.
Polar bear
Server Pages are cached on client (30 sec) and if you are doing mutation using API Routes you have to manually reset cache (router.refersh), it works automtically for server actions. Have a look at docs https://nextjs.org/docs/app/building-your-application/caching
PollockOP
when the mutation happens, I dont want to refresh the page though
European sprat
there's no other option unless you use client componets and some background fetching with react-query
which isn't a horrible thing. client components still are pre-rendered if that matters
Yes, and that’s what I’m preferring for now
PollockOP
Using fetch's 2nd argument in this test API function I made doesn't update the data either so I guess back to the client components it is 🙂
European sprat
there's a big thread about router cache here: https://github.com/vercel/next.js/issues/42991
latest comment from vercel employee timneutkens states there will be a new issue opened this week about what will be done going forward
latest comment from vercel employee timneutkens states there will be a new issue opened this week about what will be done going forward
PollockOP
I went back to useEffect and fetch as such. Sounds like this is alright from what everyones been saying