diff --git a/src/content/reference/rsc/server-components.md b/src/content/reference/rsc/server-components.md index cf33f7d2405..22018fd90f3 100644 --- a/src/content/reference/rsc/server-components.md +++ b/src/content/reference/rsc/server-components.md @@ -293,4 +293,12 @@ function Comments({commentsPromise}) { The `note` content is important data for the page to render, so we `await` it on the server. The comments are below the fold and lower-priority, so we start the promise on the server, and wait for it on the client with the `use` API. This will Suspend on the client, without blocking the `note` content from rendering. -Since async components are not supported on the client, we await the promise with `use`. +Since async components are [not supported on the client](#why-cant-i-use-async-components-on-the-client), we await the promise with `use`. + + + +#### Why can't I use async components on the client? {/*why-cant-i-use-async-components-on-the-client*/} + +Async components are a Server Component feature. Client Components need to run synchronously so they can use Hooks and respond to interactions. To wait for async data on the client, pass a Promise from a Server Component and read it with [`use`](/reference/react/use) instead. + +