Bug: Unexpected characters appear in the Chinese encoding during streaming

[shaodahong]

React version:
18.3.1

Steps To Reproduce

When I use remix to stream render a page, sometimes garbled characters appear on the page when my data contains Chinese characters. I saw through debugging that react-dom inserts null characters when parsing, which causes an exception during merging.

react/packages/react-server/src/ReactServerStreamConfigNode.js

Line 75 in 7600225

const {read, written} = textEncoder.encodeInto(stringChunk, target);

and when textEncoder.encodeInto exec

Due to business issues, I can only provide a short reproducible fragment

var util = require('util')

var textEncoder = new util.TextEncoder()

var target = new Uint8Array([0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0])

textEncoder.encodeInto(
  '__remixContext.r("routes/page.$pageName", "getConfig", {"headTitle":"升级有礼","title":"有礼升级至新版立得块优惠券20"',
  target
)
console.log(new TextDecoder().decode(target))
// result: __remixContext.r("routes/page.$pageName", "getConfig", {"headTitle":"升级有礼","title":"有��

The current behavior

When transmitting Chinese data, sometimes garbled code can occur

The expected behavior

streaming original data

[shaodahong]

uh, ok, i find it fix in #26228, However there are issues in 18.3.1 still, so maybe we should try canary or wait for 19?

[eps1lon]

I'm not sure how Remix handles React compatibility. I think it's mainly around react-router being compatible with 19 and that's planned for react-router v7 which isn't out yet.

Best to open an issue on https://github.com/remix-run/remix/ to start tracking React 19 compat.

[shaodahong]

I'm not sure how Remix handles React compatibility. I think it's mainly around react-router being compatible with 19 and that's planned for react-router v7 which isn't out yet.

Best to open an issue on https://github.com/remix-run/remix/ to start tracking React 19 compat.

Thanks for the prompt reply, I'll pin the version to 18.3.0-canary-c3048aab4-20240326 for now, it seems to be the last canary version of 18, 19 is a bit flaky and for actual production project we may need more comprehensive testing

[eps1lon]

19 is a bit flaky and for actual production project we may need more comprehensive testing

Curious what's flaky in that version. This would be valuable feedback before 19 goes stable.