archive/rsnext
1
0
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity Actions

Start client compiler when server components are finished compiling (#44716)

Browse source
This commit is contained in:
Tim Neutkens 2023-01-09 14:55:09 +01:00 committed by GitHub
parent 9c6d56122b
commit c9564849d4
No known key found for this signature in database
GPG key ID: 4AEE18F83AFDEB23
1 changed files with 38 additions and 24 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

62
packages/next/src/build/webpack/plugins/flight-client-entry-plugin.ts
View file

@ -121,7 +121,7 @@ export class FlightClientEntryPlugin {
}
async createClientEntries(compiler: any, compilation: any) {
const promises: Array<
const addClientEntryAndSSRModulesList: Array<
ReturnType<typeof this.injectClientEntryAndSSRModules>
> = []
@ -210,7 +210,7 @@ export class FlightClientEntryPlugin {
relativeRequest.replace(/\.(js|ts)x?$/, '').replace(/^src[\\/]/, '')
)
promises.push(
addClientEntryAndSSRModulesList.push(
this.injectClientEntryAndSSRModules({
compiler,
compilation,
@ -222,7 +222,7 @@ export class FlightClientEntryPlugin {
}
// Create internal app
promises.push(
addClientEntryAndSSRModulesList.push(
this.injectClientEntryAndSSRModules({
compiler,
compilation,
@ -366,14 +366,25 @@ export class FlightClientEntryPlugin {
}
)
const res = await Promise.all(promises)
// Invalidate in development to trigger recompilation
const invalidator = getInvalidator()
// Check if any of the entry injections need an invalidation
if (invalidator && res.includes(true)) {
if (
invalidator &&
addClientEntryAndSSRModulesList.some(
([shouldInvalidate]) => shouldInvalidate === true
)
) {
invalidator.invalidate([COMPILER_NAMES.client])
}
// Client compiler is invalidated before awaiting the compilation of the SSR client component entries
// so that the client compiler is running in parallel to the server compiler.
await Promise.all(
addClientEntryAndSSRModulesList.map(
(addClientEntryAndSSRModules) => addClientEntryAndSSRModules[1]
)
)
}
collectClientComponentsAndCSSForDependency({
@ -475,7 +486,7 @@ export class FlightClientEntryPlugin {
return [clientComponentImports, serverCSSImports]
}
async injectClientEntryAndSSRModules({
injectClientEntryAndSSRModules({
compiler,
compilation,
entryName,
@ -487,7 +498,7 @@ export class FlightClientEntryPlugin {
entryName: string
clientComponentImports: ClientComponentImports
bundlePath: string
}): Promise<boolean> {
}): [shouldInvalidate: boolean, addEntryPromise: Promise<void>] {
let shouldInvalidate = false
const loaderOptions: NextFlightClientEntryLoaderOptions = {
@ -549,22 +560,25 @@ export class FlightClientEntryPlugin {
}
)
// Add the dependency to the server compiler.
await this.addEntry(
compilation,
// Reuse compilation context.
compiler.context,
clientComponentEntryDep,
{
// By using the same entry name
name: entryName,
// Layer should be client for the SSR modules
// This ensures the client components are bundled on client layer
layer: WEBPACK_LAYERS.client,
}
)
return shouldInvalidate
return [
shouldInvalidate,
// Add the dependency to the server compiler.
// This promise is awaited later using `Promise.all` in order to parallelize adding the entries.
// It ensures we can parallelize the SSR and Client compiler entries.
this.addEntry(
compilation,
// Reuse compilation context.
compiler.context,
clientComponentEntryDep,
{
// By using the same entry name
name: entryName,
// Layer should be client for the SSR modules
// This ensures the client components are bundled on client layer
layer: WEBPACK_LAYERS.client,
}
),
]
}
addEntry(