Okay, server side vs client side ?
Answered
California pilchard posted this in #help-forum
California pilchardOP
I was wondering something about client and server side. I did all my NextJS using mainly client side with a lot of
React Query (from Tanstack). Why ? Because I didnt understand server side... Now I wanna understand for good why choose and WHEN choose server side isntead of client side. My main concern is the cache. I was thinking that the cache in server side was shared between multiple users (or not depending if the requested data is specific for a user or not) but seems to not be the case right ? I have a lot of interaction between useers and the interface, its something like Spotify so I guess I should keep a lot of client side stuff. I was also thinking that using server side would make the host server work more (Im using a VPS to host my app)Answered by Southern rough shrimp
its shared between anybody who calls it - it wouldnt know how to separate different users
89 Replies
American Chinchilla
Anything thats need js or hooks is for client
Otherwise server side
You can pass fetch data from ssr to react query in client
@American Chinchilla Anything thats need js or hooks is for client
California pilchardOP
I try to understand the new
'use cache' feature in NextJS 15, but Im kinda lost. Just to be sure, when we add some cache, is only for one user ? Or the cache is shared between users ?@California pilchard I try to understand the new `'use cache'` feature in NextJS 15, but Im kinda lost. Just to be sure, when we add some cache, is only for one user ? Or the cache is shared between users ?
Southern rough shrimp
its shared between anybody who calls it - it wouldnt know how to separate different users
Answer
@Southern rough shrimp its shared between anybody who calls it - it wouldnt know how to separate different users
California pilchardOP
Okay that actually good, thats means for public page (where user state isnt important) i can use
'use cache' and save a lot of request ?American black bear
"use cache" builds a cache key based on the function parameters and variables used in the functions, so if a userId is in the parameters it can be cached for a single user
@Southern rough shrimp its shared between anybody who calls it - it wouldnt know how to separate different users
California pilchardOP
But for example for a dashboard page, like if I wanna show the posts of the current logged user. I guess to identify multiple queries I have to have something like query key ? (like React Query) ?
Southern rough shrimp
Yeah I won't lie, I dont use caching in nextjs at all
I know its key based, so what davey has said is true, but im not sure how you specify the key using the directive
American black bear
caching is probably better for public facing data that won't change often like a blog, or a user profile page that might get tons of hits and you want to use ISR
"use cache" auto-generates keys supposedly, but its not stable anyways so I wouldn't use it
Southern rough shrimp
Any serializable arguments (or props) passed to the cached function, as well as any serializable values it reads from the parent scope, will be converted to a format like JSON and automatically become a part of the cache key.
@Southern rough shrimp Yeah I won't lie, I dont use caching in nextjs at all
California pilchardOP
I see something like
cacheKeySouthern rough shrimp
https://nextjs.org/docs/app/api-reference/directives/use-cache It might be worth reading this
American black bear
I'm using a hybrid approach for SSR pages that need SEO and also live data in tanstack
@California pilchard I see something like `cacheKey`
California pilchardOP
American black bear
cacheTag is for invalidation only, thats not the cache key
@American black bear cacheTag is for invalidation only, thats not the cache key
California pilchardOP
ohhhh
Southern rough shrimp
High level question: how many people are using your site?
American black bear
"use cache" directive currently does not have a method to set your own key
as far as I'm aware
unstable_cache does
California pilchardOP
Because if I have a function like :
If there is same id for a movie and a person ?
const getMovie = (id: number) => {
}
const getPerson = (id: number) => {
}If there is same id for a movie and a person ?
American black bear
IDK how "use cache" will generate a key there, I think it will use the function name and the id
Again "use cache" is experimental canary and will likely change, I'm staying away from dynamicIO til it is official
using props
@Southern rough shrimp High level question: how many people are using your site?
Southern rough shrimp
@California pilchard
@American black bear Again "use cache" is experimental canary and will likely change, I'm staying away from dynamicIO til it is official
California pilchardOP
Only props not function name ?
Southern rough shrimp
the function name stays the same
oh you're right
idk
American black bear
He's saying getMovie(1) and getPerson(1)
with use cache on both
I'd assume it uses the function name, but idk
I wouldn't use canary though, there's a lot of bugs with client navigation
@American black bear I'd assume it uses the function name, but idk
California pilchardOP
Seems pretty hard to maintain something without differenciate function name
American black bear
They need to let us set our own cache keys anyways so we can pre-seed the data from a list
But yea its not ready for production regardless
California pilchardOP
Im just haing some issue using
unstable_cache with Supabase but Im gonna check itAmerican black bear
If it's an RSC you can just use export const revalidate
Southern rough shrimp
loup how many people are using your site
@Southern rough shrimp loup how many people are using your site
California pilchardOP
ahah just a little beta version so currently not a lot (not even 1k users) but just wanna learn how cache thing
Southern rough shrimp
bro said not even 1k
American black bear
What specifically do you want to cache
Southern rough shrimp
if its more than 100 daily users caching might be worth it
is what im getting at
ISR is the way to do caching in production atm for RSC's. for server actions, unstable_cache
If you want to permanently cache an RSC you can use
export const dynamic = "force-static"@Southern rough shrimp bro said not even 1k
California pilchardOP
no no no mb for a month 😂
sry its in french
Southern rough shrimp
Thats some good stats
you working for a company?
@American black bear What specifically do you want to cache
California pilchardOP
its a movie/ tv serie app so firstly the movie page, tv serie page and all 'public' page that only change every 24h (because my python script update my databse only one time a day)
@Southern rough shrimp you working for a company?
California pilchardOP
no a student / personal project im working on (2 years now)
Southern rough shrimp
How'd you get users aware of your site?
@Southern rough shrimp How'd you get users aware of your site?
California pilchardOP
only from isntagram (my friends mainly) because I dont made any communication for now until having a very solid version
I guess I have only one chance to show so I dont wanna communicate on something with critical bug
Southern rough shrimp
you got 1350 friends?
@Southern rough shrimp you got 1350 friends?
California pilchardOP
I smile a lot 😂
thats actually a good question I never look the analytics since now and I dont really know where come from these people
Southern rough shrimp
Where do you go in the vercel dashboard to see that
California pilchardOP
orignal
Southern rough shrimp
ah might be bots
@Southern rough shrimp Where do you go in the vercel dashboard to see that
California pilchardOP
no Im done with Vercel sooo expensive for me (as a student)
@Southern rough shrimp ah might be bots
California pilchardOP
yeah probably
Southern rough shrimp
what is this dashboard then
@Southern rough shrimp Where do you go in the vercel dashboard to see that
California pilchardOP
Im using Umami
Southern rough shrimp
sorry im taking away from your help
@Southern rough shrimp sorry im taking away from your help
California pilchardOP
dw I have my answer ahah
Southern rough shrimp
ah nice
make sure to mark the solution
@Southern rough shrimp ah might be bots
California pilchardOP
well not sure its only bots because the majority of the viewed route are private (logged users only) but anyway my databse only have 150 registered users sooo
Southern rough shrimp
thats still good numbers
150 users is good
@Southern rough shrimp 150 users is good
California pilchardOP
I have actually no idea what is good or not to be honest, but thanks bro that means I didnt work for nothing 😅
Southern rough shrimp
is it open source
@Southern rough shrimp is it open source
California pilchardOP
well I did some repo that my stack use (like python script, some database schema, ...) but the nextjs not for now because when I start the repo I publish some api key in the raw ahah
Southern rough shrimp
ah
whats the url
i meant to your site
California pilchardOP
ohh
But the front page when not logged in isnt really good for now
looks like that when logged
Southern rough shrimp
looks really good
@Southern rough shrimp looks really good
California pilchardOP
thx ! 🙏