Skip to content

Commit 16e1e14

Browse files
eps1loneps1lon
authored
[node-webstreams] Use React builds for Node.js (#81048)
Closes https://linear.app/vercel/issue/NEXT-4560/ React now exposes Web stream APIs in their Node.js builds so we can use the Node.js builds. That enable us to use some of the Node.js goodies like `async_hooks` which is required for the React's experimental Server Requests track. ## Test plan `next-server` runtimes did not increase bundle size. We even saved some in the `app-page` entries since we no longer have to bundle Edge and Node.js versions of React Server. We can rely solely on the Node.js variant of React Server. A build of `test/e2e/app-dir/hello-world` shows no significant bundle size changes
1 parent 343c838 commit 16e1e14

File tree

63 files changed

+512
-708
lines changed

Some content is hidden

Large Commits have some content hidden by default. Use the searchbox below for content that may be hidden.

63 files changed

+512
-708
lines changed

‎crates/next-core/src/next_client_reference/ecmascript_client_reference/ecmascript_client_reference_module.rs

Lines changed: 2 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -85,7 +85,7 @@ impl EcmascriptClientReferenceModule {
8585
writedoc!(
8686
code,
8787
r#"
88-
import {{ registerClientReference }} from "react-server-dom-turbopack/server.edge";
88+
import {{ registerClientReference }} from "react-server-dom-turbopack/server";
8989
"#,
9090
)?;
9191

@@ -135,7 +135,7 @@ impl EcmascriptClientReferenceModule {
135135
writedoc!(
136136
code,
137137
r#"
138-
const {{ createClientModuleProxy }} = require("react-server-dom-turbopack/server.edge");
138+
const {{ createClientModuleProxy }} = require("react-server-dom-turbopack/server");
139139
140140
{TURBOPACK_EXPORT_NAMESPACE}(createClientModuleProxy({server_module_path}));
141141
"#,

‎crates/next-core/src/next_import_map.rs

Lines changed: 21 additions & 29 deletions
Original file line numberDiff line numberDiff line change
@@ -771,14 +771,12 @@ async fn apply_vendored_react_aliases_server(
771771
"react-dom/static.browser" => /* ❔ */ format!("next/dist/compiled/react-dom{react_channel}/static.browser"),
772772
"react-dom/static.edge" => /* ❔ */ format!("next/dist/compiled/react-dom{react_channel}/static.edge"),
773773
// file:///./../../../packages/next/src/compiled/react-server-dom-webpack/package.json
774-
"react-server-dom-webpack/client" => /* ❔ */ format!("next/dist/compiled/react-server-dom-turbopack{react_channel}/client.edge"),
775-
"react-server-dom-webpack/client.edge" => /* ✅ */ format!("next/dist/server/route-modules/app-page/vendored/ssr/react-server-dom-turbopack-client-edge"),
776-
"react-server-dom-webpack/server.edge" => /* ❌ */ format!("next/dist/compiled/react-server-dom-turbopack{react_channel}/server.edge"),
774+
"react-server-dom-webpack/client" => /* ✅ */ format!("next/dist/server/route-modules/app-page/vendored/ssr/react-server-dom-turbopack-client"),
775+
"react-server-dom-webpack/server" => /* ❌ */ format!("next/dist/compiled/react-server-dom-turbopack{react_channel}/server.node"),
777776
"react-server-dom-webpack/server.node" => /* ❌ */ format!("next/dist/compiled/react-server-dom-turbopack{react_channel}/server.node"),
778-
"react-server-dom-webpack/static.edge" => /* ❌ */ format!("next/dist/compiled/react-server-dom-turbopack{react_channel}/static.edge"),
779-
"react-server-dom-turbopack/client" => /* ❔ */ format!("next/dist/compiled/react-server-dom-turbopack{react_channel}/client.edge"),
780-
"react-server-dom-turbopack/client.edge" => /* ✅ */ format!("next/dist/server/route-modules/app-page/vendored/ssr/react-server-dom-turbopack-client-edge"),
781-
"react-server-dom-turbopack/server.edge" => /* ❌ */ format!("next/dist/compiled/react-server-dom-turbopack{react_channel}/server.edge"),
777+
"react-server-dom-webpack/static" => /* ❌ */ format!("next/dist/compiled/react-server-dom-turbopack{react_channel}/static.node"),
778+
"react-server-dom-turbopack/client" => /* ✅ */ format!("next/dist/server/route-modules/app-page/vendored/ssr/react-server-dom-turbopack-client"),
779+
"react-server-dom-turbopack/server" => /* ❌ */ format!("next/dist/compiled/react-server-dom-turbopack{react_channel}/server.node"),
782780
"react-server-dom-turbopack/server.node" => /* ❌ */ format!("next/dist/compiled/react-server-dom-turbopack{react_channel}/server.node"),
783781
"react-server-dom-turbopack/static.edge" => /* ❌ */ format!("next/dist/compiled/react-server-dom-turbopack{react_channel}/static.edge"),
784782
})
@@ -800,16 +798,14 @@ async fn apply_vendored_react_aliases_server(
800798
"react-dom/static.browser" => /* ❔ */ format!("next/dist/compiled/react-dom{react_channel}/static.browser"),
801799
"react-dom/static.edge" => /* ❔ */ format!("next/dist/compiled/react-dom{react_channel}/static.edge"),
802800
// file:///./../../../packages/next/src/compiled/react-server-dom-webpack/package.json
803-
"react-server-dom-webpack/client" => /* ❔ */ format!("next/dist/compiled/react-server-dom-turbopack{react_channel}/client.edge"),
804-
"react-server-dom-webpack/client.edge" => /* ❔ */ format!("next/dist/compiled/react-server-dom-turbopack{react_channel}/client.edge"),
805-
"react-server-dom-webpack/server.edge" => /* ✅ */ format!("next/dist/server/route-modules/app-page/vendored/rsc/react-server-dom-turbopack-server-edge"),
806-
"react-server-dom-webpack/server.node" => /* ✅ */ format!("next/dist/server/route-modules/app-page/vendored/rsc/react-server-dom-turbopack-server-node"),
807-
"react-server-dom-webpack/static.edge" => /* ✅ */ format!("next/dist/server/route-modules/app-page/vendored/rsc/react-server-dom-turbopack-static-edge"),
808-
"react-server-dom-turbopack/client" => /* ❔ */ format!("next/dist/compiled/react-server-dom-turbopack{react_channel}/client.edge"),
809-
"react-server-dom-turbopack/client.edge" => /* ❔ */ format!("next/dist/compiled/react-server-dom-turbopack{react_channel}/client.edge"),
810-
"react-server-dom-turbopack/server.edge" => /* ✅ */ format!("next/dist/server/route-modules/app-page/vendored/rsc/react-server-dom-turbopack-server-edge"),
811-
"react-server-dom-turbopack/server.node" => /* ✅ */ format!("next/dist/server/route-modules/app-page/vendored/rsc/react-server-dom-turbopack-server-node"),
812-
"react-server-dom-turbopack/static.edge" => /* ✅ */ format!("next/dist/server/route-modules/app-page/vendored/rsc/react-server-dom-turbopack-static-edge"),
801+
"react-server-dom-webpack/client" => /* ❔ */ format!("next/dist/compiled/react-server-dom-turbopack{react_channel}/client.node"),
802+
"react-server-dom-webpack/server" => /* ✅ */ format!("next/dist/server/route-modules/app-page/vendored/rsc/react-server-dom-turbopack-server"),
803+
"react-server-dom-webpack/server.node" => /* ✅ */ format!("next/dist/server/route-modules/app-page/vendored/rsc/react-server-dom-turbopack-server"),
804+
"react-server-dom-webpack/static" => /* ✅ */ format!("next/dist/server/route-modules/app-page/vendored/rsc/react-server-dom-turbopack-static"),
805+
"react-server-dom-turbopack/client" => /* ❔ */ format!("next/dist/compiled/react-server-dom-turbopack{react_channel}/client.node"),
806+
"react-server-dom-turbopack/server" => /* ✅ */ format!("next/dist/server/route-modules/app-page/vendored/rsc/react-server-dom-turbopack-server"),
807+
"react-server-dom-turbopack/server.node" => /* ✅ */ format!("next/dist/server/route-modules/app-page/vendored/rsc/react-server-dom-turbopack-server"),
808+
"react-server-dom-turbopack/static" => /* ✅ */ format!("next/dist/server/route-modules/app-page/vendored/rsc/react-server-dom-turbopack-static"),
813809

814810
// Needed to make `react-dom/server` work.
815811
// TODO: really?
@@ -834,15 +830,13 @@ async fn apply_vendored_react_aliases_server(
834830
"react-dom/static.edge" => /* ✅ */ format!("next/dist/compiled/react-dom{react_channel}/static.edge"),
835831
// file:///./../../../packages/next/src/compiled/react-server-dom-webpack/package.json
836832
"react-server-dom-webpack/client" => /* ✅ */ format!("next/dist/compiled/react-server-dom-turbopack{react_channel}/client.edge"),
837-
"react-server-dom-webpack/client.edge" => /* ✅ */ format!("next/dist/compiled/react-server-dom-turbopack{react_channel}/client.edge"),
838-
"react-server-dom-webpack/server.edge" => /* ❌ */ format!("next/dist/compiled/react-server-dom-turbopack{react_channel}/server.edge"),
833+
"react-server-dom-webpack/server" => /* ❌ */ format!("next/dist/compiled/react-server-dom-turbopack{react_channel}/server.edge"),
839834
"react-server-dom-webpack/server.node" => /* ❌ */ format!("next/dist/compiled/react-server-dom-turbopack{react_channel}/server.node"),
840-
"react-server-dom-webpack/static.edge" => /* ❌ */ format!("next/dist/compiled/react-server-dom-turbopack{react_channel}/static.edge"),
835+
"react-server-dom-webpack/static" => /* ❌ */ format!("next/dist/compiled/react-server-dom-turbopack{react_channel}/static.edge"),
841836
"react-server-dom-turbopack/client" => /* ✅ */ format!("next/dist/compiled/react-server-dom-turbopack{react_channel}/client.edge"),
842-
"react-server-dom-turbopack/client.edge" => /* ✅ */ format!("next/dist/compiled/react-server-dom-turbopack{react_channel}/client.edge"),
843-
"react-server-dom-turbopack/server.edge" => /* ❌ */ format!("next/dist/compiled/react-server-dom-turbopack{react_channel}/server.edge"),
837+
"react-server-dom-turbopack/server" => /* ❌ */ format!("next/dist/compiled/react-server-dom-turbopack{react_channel}/server.edge"),
844838
"react-server-dom-turbopack/server.node" => /* ❌ */ format!("next/dist/compiled/react-server-dom-turbopack{react_channel}/server.node"),
845-
"react-server-dom-turbopack/static.edge" => /* ❌ */ format!("next/dist/compiled/react-server-dom-turbopack{react_channel}/static.edge"),
839+
"react-server-dom-turbopack/static" => /* ❌ */ format!("next/dist/compiled/react-server-dom-turbopack{react_channel}/static.edge"),
846840
})
847841
} else if runtime == NextRuntime::Edge && react_condition == "server" {
848842
react_alias.extend(fxindexmap! {
@@ -863,15 +857,13 @@ async fn apply_vendored_react_aliases_server(
863857
"react-dom/static.edge" => /* ❌ */ format!("next/dist/compiled/react-dom{react_channel}/static.edge"),
864858
// file:///./../../../packages/next/src/compiled/react-server-dom-webpack/package.json
865859
"react-server-dom-webpack/client" => /* ❔ */ format!("next/dist/compiled/react-server-dom-turbopack{react_channel}/client.edge"),
866-
"react-server-dom-webpack/client.edge" => /* ❔ */ format!("next/dist/compiled/react-server-dom-turbopack{react_channel}/client.edge"),
867-
"react-server-dom-webpack/server.edge" => /* ✅ */ format!("next/dist/compiled/react-server-dom-turbopack{react_channel}/server.edge"),
860+
"react-server-dom-webpack/server" => /* ✅ */ format!("next/dist/compiled/react-server-dom-turbopack{react_channel}/server.edge"),
868861
"react-server-dom-webpack/server.node" => /* ✅ */ format!("next/dist/compiled/react-server-dom-turbopack{react_channel}/server.node"),
869-
"react-server-dom-webpack/static.edge" => /* ✅ */ format!("next/dist/compiled/react-server-dom-turbopack{react_channel}/static.edge"),
862+
"react-server-dom-webpack/static" => /* ✅ */ format!("next/dist/compiled/react-server-dom-turbopack{react_channel}/static.edge"),
870863
"react-server-dom-turbopack/client" => /* ❔ */ format!("next/dist/compiled/react-server-dom-turbopack{react_channel}/client.edge"),
871-
"react-server-dom-turbopack/client.edge" => /* ❔ */ format!("next/dist/compiled/react-server-dom-turbopack{react_channel}/client.edge"),
872-
"react-server-dom-turbopack/server.edge" => /* ✅ */ format!("next/dist/compiled/react-server-dom-turbopack{react_channel}/server.edge"),
864+
"react-server-dom-turbopack/server" => /* ✅ */ format!("next/dist/compiled/react-server-dom-turbopack{react_channel}/server.edge"),
873865
"react-server-dom-turbopack/server.node" => /* ✅ */ format!("next/dist/compiled/react-server-dom-turbopack{react_channel}/server.node"),
874-
"react-server-dom-turbopack/static.edge" => /* ✅ */ format!("next/dist/compiled/react-server-dom-turbopack{react_channel}/static.edge"),
866+
"react-server-dom-turbopack/static" => /* ✅ */ format!("next/dist/compiled/react-server-dom-turbopack{react_channel}/static.edge"),
875867
});
876868

877869
react_alias.extend(fxindexmap! {

‎packages/next/next-runtime.webpack-config.js

Lines changed: 20 additions & 24 deletions
Original file line numberDiff line numberDiff line change
@@ -23,10 +23,9 @@ const pagesExternals = [
2323
'react-dom/server.browser',
2424
'react-dom/server.edge',
2525
'react-server-dom-webpack/client',
26-
'react-server-dom-webpack/client.edge',
27-
'react-server-dom-webpack/server.edge',
26+
'react-server-dom-webpack/server',
2827
'react-server-dom-webpack/server.node',
29-
'react-server-dom-webpack/static.edge',
28+
'react-server-dom-webpack/static',
3029
]
3130

3231
const appExternals = []
@@ -42,23 +41,18 @@ function makeAppAliases({ experimental, bundler }) {
4241
'react/jsx-dev-runtime$': `next/dist/compiled/react${reactChannel}/jsx-dev-runtime`,
4342
'react/compiler-runtime$': `next/dist/compiled/react${reactChannel}/compiler-runtime`,
4443
'react-dom/client$': `next/dist/compiled/react-dom${reactChannel}/client`,
45-
'react-dom/server$': `next/dist/compiled/react-dom${reactChannel}/server`,
46-
'react-dom/static$': `next/dist/compiled/react-dom${reactChannel}/static`,
47-
'react-dom/static.edge$': `next/dist/compiled/react-dom${reactChannel}/static.edge`,
48-
'react-dom/static.browser$': `next/dist/compiled/react-dom${reactChannel}/static.browser`,
49-
// optimizations to ignore the legacy build of react-dom/server in `server.browser` build
50-
'react-dom/server.edge$': `next/dist/build/webpack/alias/react-dom-server-edge${reactChannel}.js`,
44+
// optimizations to ignore the legacy APIs in react-dom/server
45+
'react-dom/server$': `next/dist/build/webpack/alias/react-dom-server${reactChannel}.js`,
46+
'react-dom/static$': `next/dist/compiled/react-dom${reactChannel}/static.node`,
5147
// react-server-dom-webpack alias
52-
'react-server-dom-turbopack/client$': `next/dist/compiled/react-server-dom-turbopack${reactChannel}/client`,
53-
'react-server-dom-turbopack/client.edge$': `next/dist/compiled/react-server-dom-turbopack${reactChannel}/client.edge`,
54-
'react-server-dom-turbopack/server.edge$': `next/dist/compiled/react-server-dom-turbopack${reactChannel}/server.edge`,
48+
'react-server-dom-turbopack/client$': `next/dist/compiled/react-server-dom-turbopack${reactChannel}/client.node`,
49+
'react-server-dom-turbopack/server$': `next/dist/compiled/react-server-dom-turbopack${reactChannel}/server.node`,
5550
'react-server-dom-turbopack/server.node$': `next/dist/compiled/react-server-dom-turbopack${reactChannel}/server.node`,
56-
'react-server-dom-turbopack/static.edge$': `next/dist/compiled/react-server-dom-turbopack${reactChannel}/static.edge`,
57-
'react-server-dom-webpack/client$': `next/dist/compiled/react-server-dom-${bundler}${reactChannel}/client`,
58-
'react-server-dom-webpack/client.edge$': `next/dist/compiled/react-server-dom-${bundler}${reactChannel}/client.edge`,
59-
'react-server-dom-webpack/server.edge$': `next/dist/compiled/react-server-dom-${bundler}${reactChannel}/server.edge`,
51+
'react-server-dom-turbopack/static$': `next/dist/compiled/react-server-dom-turbopack${reactChannel}/static.node`,
52+
'react-server-dom-webpack/client$': `next/dist/compiled/react-server-dom-${bundler}${reactChannel}/client.node`,
53+
'react-server-dom-webpack/server$': `next/dist/compiled/react-server-dom-${bundler}${reactChannel}/server.node`,
6054
'react-server-dom-webpack/server.node$': `next/dist/compiled/react-server-dom-${bundler}${reactChannel}/server.node`,
61-
'react-server-dom-webpack/static.edge$': `next/dist/compiled/react-server-dom-${bundler}${reactChannel}/static.edge`,
55+
'react-server-dom-webpack/static$': `next/dist/compiled/react-server-dom-${bundler}${reactChannel}/static.node`,
6256
'@vercel/turbopack-ecmascript-runtime/browser/dev/hmr-client/hmr-client.ts':
6357
'next/dist/client/dev/noop-turbopack-hmr',
6458
}
@@ -167,6 +161,14 @@ module.exports = ({ dev, turbo, bundleType, experimental, ...rest }) => {
167161

168162
const bundledReactChannel = experimental ? '-experimental' : ''
169163

164+
const alias =
165+
bundleType === 'app'
166+
? makeAppAliases({
167+
experimental,
168+
bundler: turbo ? 'turbopack' : 'webpack',
169+
})
170+
: {}
171+
170172
return {
171173
entry: bundleTypes[bundleType],
172174
target: 'node',
@@ -238,13 +240,7 @@ module.exports = ({ dev, turbo, bundleType, experimental, ...rest }) => {
238240
optimizationBailout: true,
239241
},
240242
resolve: {
241-
alias:
242-
bundleType === 'app'
243-
? makeAppAliases({
244-
experimental,
245-
bundler: turbo ? 'turbopack' : 'webpack',
246-
})
247-
: {},
243+
alias,
248244
},
249245
module: {
250246
rules: [

0 commit comments

Comments
 (0)