Skip to content

Commit

Permalink
[dynamicIO] Update prerender to use Fizz prerender (#71580)
Browse files Browse the repository at this point in the history
Previously the `prerender` function for Fizz was gated to experimental
but in our latest React sync we now have access to it in the canary
channel. This updates the prerender pathway for non-experimental react
to use `prerender` rather than `renderToReadableStream`.

`prerender` has a few benefits in that it does breadth first rendering
at Suspense boundaries so you can ensure fallback UIs are fully rendered
wherever possible if you end up abortint the render.

currently stacked on #71579
  • Loading branch information
gnoff authored Oct 22, 2024
1 parent 3205aed commit 236e001
Showing 1 changed file with 30 additions and 29 deletions.
59 changes: 30 additions & 29 deletions packages/next/src/server/app-render/app-render.tsx
Original file line number Diff line number Diff line change
Expand Up @@ -2028,8 +2028,8 @@ async function spawnDynamicValidationInDev(
const { ServerInsertedHTMLProvider } = createServerInsertedHTML()
const nonce = '1'

const renderToReadableStream = require('react-dom/server.edge')
.renderToReadableStream as (typeof import('react-dom/server.edge'))['renderToReadableStream']
const prerender = require('react-dom/static.edge')
.prerender as (typeof import('react-dom/static.edge'))['prerender']

let clientDynamicTracking = createDynamicTrackingState(false)
let dynamicValidation = createDynamicValidationState()
Expand Down Expand Up @@ -2081,29 +2081,30 @@ async function spawnDynamicValidationInDev(
let hadException = false
try {
await prerenderAndAbortInSequentialTasks(
() => {
const pendingHTMLStream = workUnitAsyncStorage.run(
firstAttemptClientPrerenderStore,
renderToReadableStream,
<App
reactServerStream={firstAttemptReactServerStream}
preinitScripts={() => {}}
clientReferenceManifest={clientReferenceManifest}
ServerInsertedHTMLProvider={ServerInsertedHTMLProvider}
nonce={nonce}
/>,
{
signal: firstAttemptClientController.signal,
onError: SSROnError,
}
)
pendingHTMLStream.catch(() => {})
return pendingHTMLStream
async () => {
workUnitAsyncStorage
.run(
firstAttemptClientPrerenderStore,
prerender,
<App
reactServerStream={firstAttemptReactServerStream}
preinitScripts={() => {}}
clientReferenceManifest={clientReferenceManifest}
ServerInsertedHTMLProvider={ServerInsertedHTMLProvider}
nonce={nonce}
/>,
{
signal: firstAttemptClientController.signal,
onError: SSROnError,
}
)
.catch(() => {})
return null
},
() => {
firstAttemptClientController.abort()
}
)
).catch(() => {})
} catch (err: unknown) {
if (firstAttemptClientController.signal.aborted) {
// We aborted the render normally and can ignore this error
Expand Down Expand Up @@ -2153,7 +2154,7 @@ async function spawnDynamicValidationInDev(
workUnitAsyncStorage
.run(
secondAttemptClientPrerenderStore,
renderToReadableStream,
prerender,
<App
reactServerStream={secondAttemptReactServerStream}
preinitScripts={() => {}}
Expand All @@ -2167,6 +2168,7 @@ async function spawnDynamicValidationInDev(
}
)
.catch(() => {})
return null
},
() => {
secondAttemptClientController.abort()
Expand Down Expand Up @@ -3009,7 +3011,7 @@ async function prerenderToStream(
let htmlStream
try {
htmlStream = await prerenderAndAbortInSequentialTasks(
() => {
async () => {
const teedStream = (
workUnitAsyncStorage.run(
// The store to scope
Expand All @@ -3029,11 +3031,11 @@ async function prerenderToStream(
reactServerStream = teedStream[0]
const rscForSSRStream = teedStream[1]

const renderToReadableStream = require('react-dom/server.edge')
.renderToReadableStream as (typeof import('react-dom/server.edge'))['renderToReadableStream']
const pendingHTMLStream = workUnitAsyncStorage.run(
const prerender = require('react-dom/static.edge')
.prerender as (typeof import('react-dom/static.edge'))['prerender']
const { prelude } = await workUnitAsyncStorage.run(
ssrPrerenderStore,
renderToReadableStream,
prerender,
<App
reactServerStream={rscForSSRStream}
preinitScripts={preinitScripts}
Expand All @@ -3051,8 +3053,7 @@ async function prerenderToStream(
: [bootstrapScript],
}
)
pendingHTMLStream.catch(() => {})
return pendingHTMLStream
return prelude
},
() => {
SSRController.abort(abortReason)
Expand Down

0 comments on commit 236e001

Please sign in to comment.