Get data client-side or serverside
Unanswered
Norwegian Forest Cat posted this in #help-forum
Norwegian Forest CatOP
Hey, I'm a beginner with Next.js. I'm building a website using Next.js (v15.3.0) with CraftCMS as the backend/admin system.
I have a feature (see screenshot): when a user clicks on "zij worden gezien", some logos should appear. These logos come from CraftCMS, and I'm able to fetch them using GraphQL:
I could use some advice: should I run this query on the client side or server side? Or are there other recommended approaches for this?
I have a feature (see screenshot): when a user clicks on "zij worden gezien", some logos should appear. These logos come from CraftCMS, and I'm able to fetch them using GraphQL:
export const GLOBAL_LOGOS_QUERY = `
query GetGlobalSettings {
globalSet(handle: "navigationSettings") {
... on navigationSettings_GlobalSet {
logos {
... on logo_Entry {
text
image {
title
url
}
}
}
}
}
}
`
I could use some advice: should I run this query on the client side or server side? Or are there other recommended approaches for this?
3 Replies
This will depend on what you’re trying to achieve. If you have the data on the server already then just fetch it on the server and that’s it. Quick, clean and predictable.
If you need client data in order to fetch these resources then stick to client side data fetching.
If you need client data in order to fetch these resources then stick to client side data fetching.
When a user clicks
Any user interaction that isn't triggering a mutation most likely should be client-side fetched, that way it is only fetched when needed, saving resources and data transfer.
The only caveat to that is if the operation requires any sensitive information that you do not want to leak to the client.
Btw it is important to note that when I say "client-side fetch" I mean the client triggers the fetch, but it doesn't need to be the one generating the response.