Skip to content

Commit

Permalink
Update Connect for Node.js / SSR: React 19 RC 1 serializes Uint8Array
Browse files Browse the repository at this point in the history
Signed-off-by: Timo Stamm <[email protected]>
  • Loading branch information
timostamm committed Oct 31, 2024
1 parent e2b1f83 commit 2f222b6
Showing 1 changed file with 6 additions and 3 deletions.
9 changes: 6 additions & 3 deletions docs/web/ssr.mdx
Original file line number Diff line number Diff line change
Expand Up @@ -32,7 +32,7 @@ arrays such as Uint8Array.

**Protobuf messages are serializable by React out of the box if they:**
- Use the "proto3" syntax (which does not require the [prototype chain to track field presence](https://github.com/bufbuild/protobuf-es/blob/v2.2.1/MANUAL.md#field-presence-and-default-values)) or the Editions equivalent.
- Do not rely on `bytes` fields to keep their Uint8Array properties (they turn into plain Arrays).
- Do not rely on `bytes` fields to keep their Uint8Array properties (they turn into plain Arrays with React 18).

If your Protobuf messages are not serializable, there's a simple solution: You convert them to JSON with the
[toJson function](https://github.com/bufbuild/protobuf-es/blob/v2.2.1/MANUAL.md#serializing-messages) from
Expand Down Expand Up @@ -173,12 +173,15 @@ When the page is rendered on the server, the props for the component `Client` ar
rendered in the browser. The `payload` prop crosses the boundary, but since it's a proto3 message, React can serialize
and hydrate it without issues. It handles the BigInt value `123n` correctly.

:::note
React 18 serializes the Uint8Array of a Protobuf `bytes` field as a plain array. The release candidate for React 19
serializes and hydrates a Uint8Array correctly.
:::

For a working example of React Server Components with Next.js, check out the [Next.js](https://github.com/connectrpc/examples-es/tree/main/nextjs) project in our
[examples-es](https://github.com/connectrpc/examples-es) repo.




## Svelte

### fetch
Expand Down

0 comments on commit 2f222b6

Please sign in to comment.