Skip to content

Document Server Component transition IDs #8752

New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Open
wbinnssmith wants to merge 2 commits into
base: main
Choose a base branch
from
Open

Document Server Component transition IDs #8752

Changes from all commits
Commits
Show all changes
2 commits
Select commit Hold shift + click to select a range
5a2b198
Document Server Component timing metadata
wbinnssmith Nov 10, 2026
da0026a
Document Server Component transition IDs
wbinnssmith Nov 10, 2026
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
15 changes: 14 additions & 1 deletion src/content/reference/dev-tools/react-performance-tracks.md
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -138,7 +138,7 @@ In development builds, when you click on a component render entry, you can inspe

#### Server Requests {/*server-requests*/}

The Server Requests track visualized all Promises that eventually end up in a React Server Component. This includes any `async` operations like calling `fetch` or async Node.js file operations.
The Server Requests track visualized all Promises that eventually end up in a React Server Component. This includes any `async` operations like calling `fetch` or async Node.js file operations.

React will try to combine Promises that are started from inside third-party code into a single span representing the the duration of the entire operation blocking 1st party code.
For example, a third party library method called `getUser` that calls `fetch` internally multiple times will be represented as a single span called `getUser`, instead of showing multiple `fetch` spans.
Expand All @@ -157,3 +157,16 @@ Different colors are used to indicate the duration of the component render. The

The Server Components track group will always contain a "Primary" track. If React is able to render Server Components concurrently, it will display addititional "Parallel" tracks.
If more than 8 Server Components are rendered concurrently, React will associate them with the last "Parallel" track instead of adding more tracks.

##### Reading Server Component timing metadata {/*server-components-metadata*/}

Server Component events include structured metadata in `entry.detail.react`. Server Requests and client-side tracks do not include these fields.

| Field | Description |
| --- | --- |
| `version` | The metadata format version. Currently `1`. |
| `requestId` | The string passed as `unstable_requestId` when a framework creates the response, or `undefined` if omitted. |
| `transitionId` | The ID of active transition when the response was created, or `undefined` if none was provided. |
| `kind` | `'component'` for a Server Component render or `'await'` for a Promise it awaited. |
| `outcome` | `'completed'`, `'errored'`, or `'aborted'`. |
| `environment` | The environment name associated with the render or await, falling back to the response's environment name. |
Loading