mirror of
https://github.com/facebook/react.git
synced 2025-11-01 09:12:30 +00:00
Sebastian Markbåge
eb7f8b42c9
This lets us pass a writable on the server side and readable on the client side to send debug info through a separate channel so that it doesn't interfere with the main payload as much. The main payload refers to chunks defined in the debug info which means it's still blocked on it though. This ensures that the debug data has loaded by the time the value is rendered so that the next step can forward the data. This will be a bit fragile to race conditions until #33665 lands. Another follow up needed is the ability to skip the debug channel on the receiving side. Right now it'll block forever if you don't provide one since we're blocking on the debug data.
91 lines
2.5 KiB
JavaScript
91 lines
2.5 KiB
JavaScript
/**
|
|
* Copyright (c) Meta Platforms, Inc. and affiliates.
|
|
*
|
|
* This source code is licensed under the MIT license found in the
|
|
* LICENSE file in the root directory of this source tree.
|
|
*
|
|
* @flow
|
|
*/
|
|
|
|
/**
|
|
* This is a renderer of React that doesn't have a render target output.
|
|
* It is useful to demonstrate the internals of the reconciler in isolation
|
|
* and for testing semantics of reconciliation separate from the host
|
|
* environment.
|
|
*/
|
|
|
|
import type {FindSourceMapURLCallback} from 'react-client/flight';
|
|
|
|
import {readModule} from 'react-noop-renderer/flight-modules';
|
|
|
|
import ReactFlightClient from 'react-client/flight';
|
|
|
|
type Source = Array<Uint8Array>;
|
|
|
|
const decoderOptions = {stream: true};
|
|
|
|
const {createResponse, createStreamState, processBinaryChunk, getRoot, close} =
|
|
ReactFlightClient({
|
|
createStringDecoder() {
|
|
return new TextDecoder();
|
|
},
|
|
readPartialStringChunk(decoder: TextDecoder, buffer: Uint8Array): string {
|
|
return decoder.decode(buffer, decoderOptions);
|
|
},
|
|
readFinalStringChunk(decoder: TextDecoder, buffer: Uint8Array): string {
|
|
return decoder.decode(buffer);
|
|
},
|
|
resolveClientReference(bundlerConfig: null, idx: string) {
|
|
return idx;
|
|
},
|
|
prepareDestinationForModule(moduleLoading: null, metadata: string) {},
|
|
preloadModule(idx: string) {},
|
|
requireModule(idx: string) {
|
|
return readModule(idx);
|
|
},
|
|
parseModel(response: Response, json) {
|
|
return JSON.parse(json, response._fromJSON);
|
|
},
|
|
bindToConsole(methodName, args, badgeName) {
|
|
return Function.prototype.bind.apply(
|
|
// eslint-disable-next-line react-internal/no-production-logging
|
|
console[methodName],
|
|
[console].concat(args),
|
|
);
|
|
},
|
|
});
|
|
|
|
type ReadOptions = {|
|
|
findSourceMapURL?: FindSourceMapURLCallback,
|
|
debugChannel?: {onMessage: (message: string) => void},
|
|
close?: boolean,
|
|
|};
|
|
|
|
function read<T>(source: Source, options: ReadOptions): Thenable<T> {
|
|
const response = createResponse(
|
|
source,
|
|
null,
|
|
null,
|
|
undefined,
|
|
undefined,
|
|
undefined,
|
|
undefined,
|
|
options !== undefined ? options.findSourceMapURL : undefined,
|
|
true,
|
|
undefined,
|
|
__DEV__ && options !== undefined && options.debugChannel !== undefined
|
|
? options.debugChannel.onMessage
|
|
: undefined,
|
|
);
|
|
const streamState = createStreamState();
|
|
for (let i = 0; i < source.length; i++) {
|
|
processBinaryChunk(response, streamState, source[i], 0);
|
|
}
|
|
if (options !== undefined && options.close) {
|
|
close(response);
|
|
}
|
|
return getRoot(response);
|
|
}
|
|
|
|
export {read};
|