Turbopack: Allow client components from foreign code in app routes #64751

wbinnssmith · 2024-04-18T20:51:52Z

This extends #64520 to cover cases where client components originate from node_modules (foreign code).

Test Plan: Extended the integration test to cover this

This extends #64520 to cover cases where client components originate from node_modules (foreign code). Test Plan: Extended the integration test to cover this

kwonoj · 2024-04-18T20:52:56Z

packages/next-swc/crates/next-core/src/next_server/context.rs

-                    .await?,
-            );
+            next_server_rules.extend(common_next_server_rules.iter().cloned());
+            internal_custom_rules.extend(common_next_server_rules);


this rule combination & ordering game gets more and more interesting 😅

ijjk · 2024-04-18T20:58:21Z

Tests Passed

ijjk · 2024-04-18T21:02:24Z

Stats from current PR

Default Build (Increase detected ⚠️)

General

	vercel/next.js canary	vercel/next.js wbinnssmith/client-components-node-modules	Change
buildDuration	28.8s	27.1s	N/A
buildDurationCached	15.7s	13.5s	N/A
nodeModulesSize	359 MB	359 MB	N/A
nextStartRea..uration (ms)	688ms	694ms	N/A

Client Bundles (main, webpack)

	vercel/next.js canary	vercel/next.js wbinnssmith/client-components-node-modules	Change
1103-HASH.js gzip	31.8 kB	31.8 kB	N/A
1a9f679d-HASH.js gzip	53.5 kB	53.5 kB	N/A
335-HASH.js gzip	5.09 kB	5.09 kB	N/A
7953.HASH.js gzip	169 B	169 B	✓
framework-HASH.js gzip	45.2 kB	45.2 kB	✓
main-app-HASH.js gzip	229 B	228 B	N/A
main-HASH.js gzip	31.5 kB	31.6 kB	N/A
webpack-HASH.js gzip	1.65 kB	1.65 kB	N/A
Overall change	45.4 kB	45.4 kB	✓

Legacy Client Bundles (polyfills)

	vercel/next.js canary	vercel/next.js wbinnssmith/client-components-node-modules	Change
polyfills-HASH.js gzip	31 kB	31 kB	✓
Overall change	31 kB	31 kB	✓

Client Pages

	vercel/next.js canary	vercel/next.js wbinnssmith/client-components-node-modules	Change
_app-HASH.js gzip	192 B	193 B	N/A
_error-HASH.js gzip	192 B	193 B	N/A
amp-HASH.js gzip	507 B	511 B	N/A
css-HASH.js gzip	341 B	343 B	N/A
dynamic-HASH.js gzip	2.52 kB	2.52 kB	✓
edge-ssr-HASH.js gzip	266 B	265 B	N/A
head-HASH.js gzip	362 B	365 B	N/A
hooks-HASH.js gzip	392 B	392 B	✓
image-HASH.js gzip	4.32 kB	4.32 kB	N/A
index-HASH.js gzip	268 B	268 B	✓
link-HASH.js gzip	2.69 kB	2.69 kB	N/A
routerDirect..HASH.js gzip	329 B	328 B	N/A
script-HASH.js gzip	397 B	397 B	✓
withRouter-HASH.js gzip	324 B	324 B	✓
1afbb74e6ecf..834.css gzip	106 B	106 B	✓
Overall change	4 kB	4 kB	✓

Client Build Manifests

	vercel/next.js canary	vercel/next.js wbinnssmith/client-components-node-modules	Change
_buildManifest.js gzip	483 B	483 B	✓
Overall change	483 B	483 B	✓

Rendered Page Sizes

	vercel/next.js canary	vercel/next.js wbinnssmith/client-components-node-modules	Change
index.html gzip	526 B	528 B	N/A
link.html gzip	540 B	540 B	✓
withRouter.html gzip	523 B	524 B	N/A
Overall change	540 B	540 B	✓

Edge SSR bundle Size Overall increase ⚠️

	vercel/next.js canary	vercel/next.js wbinnssmith/client-components-node-modules	Change
edge-ssr.js gzip	94.7 kB	108 kB	⚠️ +13.5 kB
page.js gzip	3.06 kB	3.04 kB	N/A
Overall change	94.7 kB	108 kB	⚠️ +13.5 kB

Middleware size

	vercel/next.js canary	vercel/next.js wbinnssmith/client-components-node-modules	Change
middleware-b..fest.js gzip	623 B	623 B	✓
middleware-r..fest.js gzip	156 B	156 B	✓
middleware.js gzip	27.9 kB	27.9 kB	N/A
edge-runtime..pack.js gzip	839 B	839 B	✓
Overall change	1.62 kB	1.62 kB	✓

Next Runtimes Overall increase ⚠️

	vercel/next.js canary	vercel/next.js wbinnssmith/client-components-node-modules	Change
app-page-exp...dev.js gzip	171 kB	171 kB	N/A
app-page-exp..prod.js gzip	98.5 kB	98.4 kB	N/A
app-page-tur..prod.js gzip	100 kB	99.9 kB	N/A
app-page-tur..prod.js gzip	94.3 kB	94.2 kB	N/A
app-page.run...dev.js gzip	157 kB	157 kB	N/A
app-page.run..prod.js gzip	93 kB	93 kB	N/A
app-route-ex...dev.js gzip	21.5 kB	21.4 kB	N/A
app-route-ex..prod.js gzip	15.2 kB	15.2 kB	N/A
app-route-tu..prod.js gzip	15.2 kB	15.2 kB	N/A
app-route-tu..prod.js gzip	15 kB	14.9 kB	N/A
app-route.ru...dev.js gzip	21.3 kB	21.3 kB	N/A
app-route.ru..prod.js gzip	15 kB	14.9 kB	N/A
pages-api-tu..prod.js gzip	9.55 kB	9.55 kB	✓
pages-api.ru...dev.js gzip	9.82 kB	9.82 kB	✓
pages-api.ru..prod.js gzip	9.55 kB	9.55 kB	✓
pages-turbo...prod.js gzip	21.5 kB	21.4 kB	N/A
pages.runtim...dev.js gzip	22.1 kB	22.1 kB	N/A
pages.runtim..prod.js gzip	21.5 kB	21.4 kB	N/A
server.runti..prod.js gzip	51.6 kB	65.3 kB	⚠️ +13.7 kB
Overall change	80.5 kB	94.2 kB	⚠️ +13.7 kB

build cache Overall increase ⚠️

	vercel/next.js canary	vercel/next.js wbinnssmith/client-components-node-modules	Change
0.pack gzip	1.62 MB	1.61 MB	N/A
index.pack gzip	112 kB	112 kB	⚠️ +133 B
Overall change	112 kB	112 kB	⚠️ +133 B

Diff details

Diff for page.js

Diff too large to display

Diff for edge-ssr.js

Diff too large to display

Diff for 1103-HASH.js

Diff too large to display

Diff for app-page-exp..ntime.dev.js

failed to diff

Diff for app-page-exp..time.prod.js

Diff too large to display

Diff for app-page-tur..time.prod.js

Diff too large to display

Diff for app-page-tur..time.prod.js

Diff too large to display

Diff for app-page.runtime.dev.js

Diff too large to display

Diff for app-page.runtime.prod.js

Diff too large to display

Diff for app-route-ex..ntime.dev.js

Diff too large to display

Diff for app-route-ex..time.prod.js

Diff too large to display

Diff for app-route-tu..time.prod.js

Diff too large to display

Diff for app-route-tu..time.prod.js

Diff too large to display

Diff for app-route.runtime.dev.js

Diff too large to display

Diff for app-route.ru..time.prod.js

Diff too large to display

Diff for pages-turbo...time.prod.js

Diff too large to display

Diff for pages.runtime.dev.js

Diff too large to display

Diff for pages.runtime.prod.js

Diff too large to display

Diff for server.runtime.prod.js

Diff too large to display

Commit: ce32731

…mponents-node-modules

…utes

…utes Co-authored-by: OJ Kwon <1210596+kwonoj@users.noreply.github.com>

…utes

Turbopack: Allow client components from foreign code in app routes

8e99089

This extends #64520 to cover cases where client components originate from node_modules (foreign code). Test Plan: Extended the integration test to cover this

wbinnssmith requested review from timneutkens, ijjk, shuding, huozhi, a team, feedthejim, ztanner and wyattjoh as code owners April 18, 2024 20:51

ijjk added created-by: Turbopack team PRs by the Turbopack team. tests Turbopack Related to Turbopack with Next.js. type: next labels Apr 18, 2024

wbinnssmith requested review from kwonoj, sokra and bgw April 18, 2024 20:52

kwonoj approved these changes Apr 18, 2024

View reviewed changes

wbinnssmith mentioned this pull request Apr 23, 2024

14.2.0 throws errors with Turbopack when importing client components in route handlers that use context #64412

Closed

wbinnssmith and others added 4 commits April 25, 2024 14:26

Merge remote-tracking branch 'origin/main' into wbinnssmith/client-co…

c6981e1

…mponents-node-modules

fixup! Turbopack: Allow client components from foreign code in app ro…

33c6b42

…utes

fixup! Turbopack: Allow client components from foreign code in app ro…

d9bf8fc

…utes Co-authored-by: OJ Kwon <1210596+kwonoj@users.noreply.github.com>

fixup! Turbopack: Allow client components from foreign code in app ro…

ce32731

…utes

wbinnssmith merged commit 9a3c9ed into canary Apr 26, 2024
80 checks passed

wbinnssmith deleted the wbinnssmith/client-components-node-modules branch April 26, 2024 22:26

github-actions bot added the locked label May 11, 2024

github-actions bot locked as resolved and limited conversation to collaborators May 11, 2024

Provide feedback

Saved searches

Use saved searches to filter your results more quickly

Turbopack: Allow client components from foreign code in app routes #64751

Turbopack: Allow client components from foreign code in app routes #64751

wbinnssmith commented Apr 18, 2024 •

edited by ForsakenHarmony

Loading

kwonoj Apr 18, 2024

ijjk commented Apr 18, 2024 •

edited

Loading

ijjk commented Apr 18, 2024 •

edited

Loading

Turbopack: Allow client components from foreign code in app routes #64751

Turbopack: Allow client components from foreign code in app routes #64751

Conversation

wbinnssmith commented Apr 18, 2024 • edited by ForsakenHarmony Loading

kwonoj Apr 18, 2024

Choose a reason for hiding this comment

ijjk commented Apr 18, 2024 • edited Loading

Tests Passed

ijjk commented Apr 18, 2024 • edited Loading

Stats from current PR

wbinnssmith commented Apr 18, 2024 •

edited by ForsakenHarmony

Loading

ijjk commented Apr 18, 2024 •

edited

Loading

ijjk commented Apr 18, 2024 •

edited

Loading