re: "useSWR" - React Hooks for Remote Data Fetching VIEW POST

re: I'm a total React noob, but I would normally do this with useEffect. Is the main benefit the support for suspense?

Ah, I think I see after playing with your example. It's nice to have it remote/local friendly out of the box. Thanks!


As I am also a noob at useSWR, I just tried to explain as much as I know :p

I would normally do this with useEffect

Yes. One would normally use useEffect by default to fetch data (as it's a side effect).

useSWR would ease the burden of having to write much boilterplate code.

useSWR is using useLayoutEffect over useEffect (, which I'd like to know the reason behind it).


thinking out loudly:

Maybe this article by Dave Ceddia would provide an answer.

When to useLayoutEffect Instead of useEffect

Is the main benefit the support for suspense?

It's only one of the nice features :)

The main benefit is hidden in the name, SWR

SWR first returns the data from cache (stale), then sends the fetch request (revalidate), and finally comes with the up-to-date data again.

Basically not showing "loading" screen as soon as a data is being fetched/refetched.

That sounds a bit like Pending → Skeleton → Complete Concurrent UI pattern in the experimental channel (but not sure if they are the same).

You can also do optimisitic UI update using mutate, meaning, you can show updated state right away before getting remote data. And revert if the change was not made.

code of conduct - report abuse