Is the React 19 use() hook only for server components?
Can client components also handle async data with use(promise)? The official docs only show server component examples, so I don't have a clear idea—hence my question.
7 answers
Yeah, it works on the client too. But using useEffect is just more comfortable.
I went through the same struggle. use(promise) does work in client components, but the promise needs to be passed in already started, and since it suspends during rendering, you have to watch out for waterfalls. The official docs focus mainly on the server side, but you can test it on the client too. That said, there are a few caveats during SSR hydration.
Well, use() doesn't seem that great. Wouldn't it be better to just wrap it in suspense?
Got a source? I was curious too.
I tried using use() in the client, and I'd recommend using it only when absolutely necessary. It still doesn't feel quite stable, and if you're already used to the existing pattern, there isn't much of an advantage. It worked fine in test code, though.
For reference, React 19 is still in RC, and it's true that use() works on the client. But the official docs only emphasize server components, which I think confuses people. When I actually applied it to a project, it worked fine on the client too, but it was safer to use it with an error boundary. Just a heads-up.
Oh, I'm learning this too lol