From ad2ed840e74a34075e44a2e2a29ae011e11e4142 Mon Sep 17 00:00:00 2001 From: Shu Ding Date: Wed, 6 Apr 2022 16:04:43 +0200 Subject: [PATCH 1/3] refactor code --- .../next/server/node-web-streams-helper.ts | 30 +++++-------------- packages/next/server/render.tsx | 22 +++++++------- 2 files changed, 19 insertions(+), 33 deletions(-) diff --git a/packages/next/server/node-web-streams-helper.ts b/packages/next/server/node-web-streams-helper.ts index 04de9e57295dd6e..9bd2f6a72fa3142 100644 --- a/packages/next/server/node-web-streams-helper.ts +++ b/packages/next/server/node-web-streams-helper.ts @@ -305,28 +305,14 @@ export async function renderToStream({ generateStaticHTML: boolean flushEffectHandler?: () => Promise }): Promise> { - const closeTag = '' - const suffixUnclosed = suffix ? suffix.split(closeTag)[0] : null - const renderStream: ReadableStream & { - allReady?: Promise - } = await (ReactDOMServer as any).renderToReadableStream(element) - - if (generateStaticHTML) { - await renderStream.allReady - } - - const transforms: Array> = [ - createBufferedTransformStream(), - flushEffectHandler ? createFlushEffectStream(flushEffectHandler) : null, - suffixUnclosed != null ? createPrefixStream(suffixUnclosed) : null, - dataStream ? createInlineDataStream(dataStream) : null, - suffixUnclosed != null ? createSuffixStream(closeTag) : null, - ].filter(Boolean) as any - - return transforms.reduce( - (readable, transform) => pipeThrough(readable, transform), - renderStream - ) + const renderStream = await renderToInitialStream({ ReactDOMServer, element }) + return continueFromInitialStream({ + suffix, + dataStream, + generateStaticHTML, + flushEffectHandler, + renderStream, + }) } export function createSuffixStream( diff --git a/packages/next/server/render.tsx b/packages/next/server/render.tsx index 660848c496d409c..549f80f6b15d55c 100644 --- a/packages/next/server/render.tsx +++ b/packages/next/server/render.tsx @@ -88,8 +88,9 @@ let warn: typeof import('../build/output/log').warn let postProcess: typeof import('../shared/lib/post-process').default const DOCTYPE = '' +const isEdgeRuntime = !!process.browser -if (!process.browser) { +if (!isEdgeRuntime) { require('./node-polyfill-web-streams') optimizeAmp = require('./optimize-amp').default getFontDefinitionFromManifest = @@ -511,8 +512,7 @@ export async function renderToHTML( let serverComponentsPageDataTransformStream: TransformStream< Uint8Array, Uint8Array - > | null = - isServerComponent && !process.browser ? new TransformStream() : null + > | null = isServerComponent && !isEdgeRuntime ? new TransformStream() : null if (isServerComponent) { serverComponentsInlinedTransformStream = new TransformStream() @@ -693,7 +693,7 @@ export async function renderToHTML( let isPreview let previewData: PreviewData - if ((isSSG || getServerSideProps) && !isFallback && !process.browser) { + if ((isSSG || getServerSideProps) && !isFallback && !isEdgeRuntime) { // Reads of this are cached on the `req` object, so this should resolve // instantly. There's no need to pass this data down from a previous // invoke, where we'd have to consider server & serverless. @@ -763,7 +763,7 @@ export async function renderToHTML( } // Disable AMP under the web environment - const inAmpMode = !process.browser && isInAmpMode(ampState) + const inAmpMode = !isEdgeRuntime && isInAmpMode(ampState) const reactLoadableModules: string[] = [] @@ -1291,7 +1291,7 @@ export async function renderToHTML( | typeof Document | undefined - if (process.browser && Document.getInitialProps) { + if (isEdgeRuntime && Document.getInitialProps) { // In the Edge runtime, `Document.getInitialProps` isn't supported. // We throw an error here if it's customized. if (!builtinDocument) { @@ -1301,7 +1301,7 @@ export async function renderToHTML( } } - if ((isServerComponent || process.browser) && Document.getInitialProps) { + if ((isServerComponent || isEdgeRuntime) && Document.getInitialProps) { if (builtinDocument) { Document = builtinDocument } else { @@ -1499,7 +1499,7 @@ export async function renderToHTML( const hasDocumentGetInitialProps = !( isServerComponent || - process.browser || + isEdgeRuntime || !Document.getInitialProps ) @@ -1510,7 +1510,7 @@ export async function renderToHTML( const { docProps } = (documentInitialPropsRes as any) || {} const documentElement = () => { - if (isServerComponent || process.browser) { + if (isServerComponent || isEdgeRuntime) { return (Document as any)() } @@ -1711,7 +1711,7 @@ export async function renderToHTML( return html } : null, - !process.browser && process.env.__NEXT_OPTIMIZE_FONTS + !isEdgeRuntime && process.env.__NEXT_OPTIMIZE_FONTS ? async (html: string) => { return await postProcess( html, @@ -1722,7 +1722,7 @@ export async function renderToHTML( ) } : null, - !process.browser && renderOpts.optimizeCss + !isEdgeRuntime && renderOpts.optimizeCss ? async (html: string) => { // eslint-disable-next-line import/no-extraneous-dependencies const Critters = require('critters') From 63b58c4ca7d4467e8a44bfa22ed9a46572960894 Mon Sep 17 00:00:00 2001 From: Shu Ding Date: Wed, 6 Apr 2022 16:05:41 +0200 Subject: [PATCH 2/3] use const instead of let --- packages/next/server/render.tsx | 8 ++------ 1 file changed, 2 insertions(+), 6 deletions(-) diff --git a/packages/next/server/render.tsx b/packages/next/server/render.tsx index 549f80f6b15d55c..d57f51b7981aefc 100644 --- a/packages/next/server/render.tsx +++ b/packages/next/server/render.tsx @@ -1419,19 +1419,15 @@ export async function renderToHTML( } } } else { - let bodyResult - - let renderStream: any - // We start rendering the shell earlier, before returning the head tags // to `documentResult`. const content = renderContent() - renderStream = await renderToInitialStream({ + const renderStream = await renderToInitialStream({ ReactDOMServer, element: content, }) - bodyResult = async (suffix: string) => { + const bodyResult = async (suffix: string) => { // this must be called inside bodyResult so appWrappers is // up to date when getWrappedApp is called From 99bdecf8a14009cd416d0dd4a79f2e1aaf0540cf Mon Sep 17 00:00:00 2001 From: Shu Ding Date: Wed, 6 Apr 2022 16:22:57 +0200 Subject: [PATCH 3/3] revert --- packages/next/server/render.tsx | 22 +++++++++++----------- 1 file changed, 11 insertions(+), 11 deletions(-) diff --git a/packages/next/server/render.tsx b/packages/next/server/render.tsx index d57f51b7981aefc..6b535f2c06c9c21 100644 --- a/packages/next/server/render.tsx +++ b/packages/next/server/render.tsx @@ -88,9 +88,8 @@ let warn: typeof import('../build/output/log').warn let postProcess: typeof import('../shared/lib/post-process').default const DOCTYPE = '' -const isEdgeRuntime = !!process.browser -if (!isEdgeRuntime) { +if (!process.browser) { require('./node-polyfill-web-streams') optimizeAmp = require('./optimize-amp').default getFontDefinitionFromManifest = @@ -512,7 +511,8 @@ export async function renderToHTML( let serverComponentsPageDataTransformStream: TransformStream< Uint8Array, Uint8Array - > | null = isServerComponent && !isEdgeRuntime ? new TransformStream() : null + > | null = + isServerComponent && !process.browser ? new TransformStream() : null if (isServerComponent) { serverComponentsInlinedTransformStream = new TransformStream() @@ -693,7 +693,7 @@ export async function renderToHTML( let isPreview let previewData: PreviewData - if ((isSSG || getServerSideProps) && !isFallback && !isEdgeRuntime) { + if ((isSSG || getServerSideProps) && !isFallback && !process.browser) { // Reads of this are cached on the `req` object, so this should resolve // instantly. There's no need to pass this data down from a previous // invoke, where we'd have to consider server & serverless. @@ -763,7 +763,7 @@ export async function renderToHTML( } // Disable AMP under the web environment - const inAmpMode = !isEdgeRuntime && isInAmpMode(ampState) + const inAmpMode = !process.browser && isInAmpMode(ampState) const reactLoadableModules: string[] = [] @@ -1291,7 +1291,7 @@ export async function renderToHTML( | typeof Document | undefined - if (isEdgeRuntime && Document.getInitialProps) { + if (process.browser && Document.getInitialProps) { // In the Edge runtime, `Document.getInitialProps` isn't supported. // We throw an error here if it's customized. if (!builtinDocument) { @@ -1301,7 +1301,7 @@ export async function renderToHTML( } } - if ((isServerComponent || isEdgeRuntime) && Document.getInitialProps) { + if ((isServerComponent || process.browser) && Document.getInitialProps) { if (builtinDocument) { Document = builtinDocument } else { @@ -1495,7 +1495,7 @@ export async function renderToHTML( const hasDocumentGetInitialProps = !( isServerComponent || - isEdgeRuntime || + process.browser || !Document.getInitialProps ) @@ -1506,7 +1506,7 @@ export async function renderToHTML( const { docProps } = (documentInitialPropsRes as any) || {} const documentElement = () => { - if (isServerComponent || isEdgeRuntime) { + if (isServerComponent || process.browser) { return (Document as any)() } @@ -1707,7 +1707,7 @@ export async function renderToHTML( return html } : null, - !isEdgeRuntime && process.env.__NEXT_OPTIMIZE_FONTS + !process.browser && process.env.__NEXT_OPTIMIZE_FONTS ? async (html: string) => { return await postProcess( html, @@ -1718,7 +1718,7 @@ export async function renderToHTML( ) } : null, - !isEdgeRuntime && renderOpts.optimizeCss + !process.browser && renderOpts.optimizeCss ? async (html: string) => { // eslint-disable-next-line import/no-extraneous-dependencies const Critters = require('critters')