Client Side Data Fetching, best practice?

[welschmoor]

Hey, if I want to client-side fetch some data, what's the best way of doing that? useEffect ? Any packages I should be aware of (like the tanstack query and useSWR)?

[CAYdenberg]

Basically, yeah, put your data in useState and then have a useEffect that fires off a request and sets the state when the request comes back. This is sort of the classic React way of fetching data. Be aware that your component will "exist" before the data is returned.

An alternative is to use SSR to get the default data and then update when needed. In this case you pass the prop containing the data into useState to set the initial state and then use a callback (instead of an effect) to update in response to some kind of interaction.

[lfjsa]

About two years ago I tested converting a Next.js project using useSWR to Preact and that part worked. Worth giving a try before building your own version.

A fresher alternative is to submit a form or navigate and then use Fresh's <Partial /> component to make it feel instant. Works well in my experience.