mirror of
https://github.com/facebook/react.git
synced 2026-02-27 03:07:57 +00:00
701ac2e572
Currently when we SSR a Flight response we do not emit any resources for module imports. This means that when the client hydrates it won't have already loaded the necessary scripts to satisfy the Imports defined in the Flight payload which will lead to a delay in hydration completing. This change updates `react-server-dom-webpack` and `react-server-dom-esm` to emit async script tags in the head when we encounter a modules in the flight response. To support this we need some additional server configuration. We need to know the path prefix for chunk loading and whether the chunks will load with CORS or not (and if so with what configuration).
77 lines
1.8 KiB
JavaScript
77 lines
1.8 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
|
|
*/
|
|
|
|
import type {Thenable} from 'shared/ReactTypes.js';
|
|
|
|
import type {Response} from 'react-client/src/ReactFlightClient';
|
|
|
|
import type {
|
|
SSRModuleMap,
|
|
ModuleLoading,
|
|
} from 'react-client/src/ReactFlightClientConfig';
|
|
|
|
type SSRManifest = {
|
|
moduleMap: SSRModuleMap,
|
|
moduleLoading: ModuleLoading,
|
|
};
|
|
|
|
import type {Readable} from 'stream';
|
|
|
|
import {
|
|
createResponse,
|
|
getRoot,
|
|
reportGlobalError,
|
|
processBinaryChunk,
|
|
close,
|
|
} from 'react-client/src/ReactFlightClient';
|
|
|
|
import {createServerReference as createServerReferenceImpl} from 'react-client/src/ReactFlightReplyClient';
|
|
|
|
function noServerCall() {
|
|
throw new Error(
|
|
'Server Functions cannot be called during initial render. ' +
|
|
'This would create a fetch waterfall. Try to use a Server Component ' +
|
|
'to pass data to Client Components instead.',
|
|
);
|
|
}
|
|
|
|
export function createServerReference<A: Iterable<any>, T>(
|
|
id: any,
|
|
callServer: any,
|
|
): (...A) => Promise<T> {
|
|
return createServerReferenceImpl(id, noServerCall);
|
|
}
|
|
|
|
export type Options = {
|
|
nonce?: string,
|
|
};
|
|
|
|
function createFromNodeStream<T>(
|
|
stream: Readable,
|
|
ssrManifest: SSRManifest,
|
|
options?: Options,
|
|
): Thenable<T> {
|
|
const response: Response = createResponse(
|
|
ssrManifest.moduleMap,
|
|
ssrManifest.moduleLoading,
|
|
noServerCall,
|
|
options && typeof options.nonce === 'string' ? options.nonce : undefined,
|
|
);
|
|
stream.on('data', chunk => {
|
|
processBinaryChunk(response, chunk);
|
|
});
|
|
stream.on('error', error => {
|
|
reportGlobalError(response, error);
|
|
});
|
|
stream.on('end', () => close(response));
|
|
return getRoot(response);
|
|
}
|
|
|
|
export {createFromNodeStream};
|