From 7b348fa0f2a2e42d7d64ff379430b14d54562f15 Mon Sep 17 00:00:00 2001 From: Alex Kirszenberg Date: Fri, 28 Apr 2023 20:37:34 +0200 Subject: [PATCH] Use ProxiedAsset instead of css_chunk_root_path to expose RSC CSS chunks (#48946) See https://github.com/vercel/turbo/pull/4740 This enables RSC CSS HMR. The `css_chunk_root_path` way somehow broke the propagation of invalidation for CSS chunks. This also updates Turbopack with the following changes: * https://github.com/vercel/turbo/pull/4738 * https://github.com/vercel/turbo/pull/4740 * https://github.com/vercel/turbo/pull/4741 --------- Co-authored-by: Tobias Koppers --- Cargo.lock | 68 ++++++++++--------- Cargo.toml | 6 +- .../next-swc/crates/next-core/js/package.json | 4 +- .../next-core/js/src/entry/app/hydrate.tsx | 3 + .../crates/next-core/src/app_source.rs | 2 - .../with_client_chunks.rs | 51 ++++++++++---- packages/next/src/client/app-index.tsx | 53 +-------------- packages/next/src/client/app-link-gc.ts | 53 +++++++++++++++ pnpm-lock.yaml | 33 +++------ 9 files changed, 146 insertions(+), 127 deletions(-) create mode 100644 packages/next/src/client/app-link-gc.ts diff --git a/Cargo.lock b/Cargo.lock index bc634b870c81..b1d7206571d1 100644 --- a/Cargo.lock +++ b/Cargo.lock @@ -400,7 +400,7 @@ dependencies = [ [[package]] name = "auto-hash-map" version = "0.1.0" -source = "git+https://github.com/vercel/turbo.git?tag=turbopack-230427.3#0e9881f822a6854a2b0daaf550b5eab91fd56771" +source = "git+https://github.com/vercel/turbo.git?tag=turbopack-230428.3#a64b0c13b08666537520d0c4d0fbcca07307876a" dependencies = [ "serde", ] @@ -3412,7 +3412,7 @@ dependencies = [ [[package]] name = "node-file-trace" version = "0.1.0" -source = "git+https://github.com/vercel/turbo.git?tag=turbopack-230427.3#0e9881f822a6854a2b0daaf550b5eab91fd56771" +source = "git+https://github.com/vercel/turbo.git?tag=turbopack-230428.3#a64b0c13b08666537520d0c4d0fbcca07307876a" dependencies = [ "anyhow", "serde", @@ -6973,7 +6973,7 @@ dependencies = [ [[package]] name = "turbo-binding" version = "0.1.0" -source = "git+https://github.com/vercel/turbo.git?tag=turbopack-230427.3#0e9881f822a6854a2b0daaf550b5eab91fd56771" +source = "git+https://github.com/vercel/turbo.git?tag=turbopack-230428.3#a64b0c13b08666537520d0c4d0fbcca07307876a" dependencies = [ "auto-hash-map", "mdxjs", @@ -7013,7 +7013,7 @@ dependencies = [ [[package]] name = "turbo-malloc" version = "0.1.0" -source = "git+https://github.com/vercel/turbo.git?tag=turbopack-230427.3#0e9881f822a6854a2b0daaf550b5eab91fd56771" +source = "git+https://github.com/vercel/turbo.git?tag=turbopack-230428.3#a64b0c13b08666537520d0c4d0fbcca07307876a" dependencies = [ "mimalloc", ] @@ -7021,7 +7021,7 @@ dependencies = [ [[package]] name = "turbo-tasks" version = "0.1.0" -source = "git+https://github.com/vercel/turbo.git?tag=turbopack-230427.3#0e9881f822a6854a2b0daaf550b5eab91fd56771" +source = "git+https://github.com/vercel/turbo.git?tag=turbopack-230428.3#a64b0c13b08666537520d0c4d0fbcca07307876a" dependencies = [ "anyhow", "auto-hash-map", @@ -7051,7 +7051,7 @@ dependencies = [ [[package]] name = "turbo-tasks-build" version = "0.1.0" -source = "git+https://github.com/vercel/turbo.git?tag=turbopack-230427.3#0e9881f822a6854a2b0daaf550b5eab91fd56771" +source = "git+https://github.com/vercel/turbo.git?tag=turbopack-230428.3#a64b0c13b08666537520d0c4d0fbcca07307876a" dependencies = [ "anyhow", "cargo-lock", @@ -7063,7 +7063,7 @@ dependencies = [ [[package]] name = "turbo-tasks-bytes" version = "0.1.0" -source = "git+https://github.com/vercel/turbo.git?tag=turbopack-230427.3#0e9881f822a6854a2b0daaf550b5eab91fd56771" +source = "git+https://github.com/vercel/turbo.git?tag=turbopack-230428.3#a64b0c13b08666537520d0c4d0fbcca07307876a" dependencies = [ "anyhow", "bytes", @@ -7078,7 +7078,7 @@ dependencies = [ [[package]] name = "turbo-tasks-env" version = "0.1.0" -source = "git+https://github.com/vercel/turbo.git?tag=turbopack-230427.3#0e9881f822a6854a2b0daaf550b5eab91fd56771" +source = "git+https://github.com/vercel/turbo.git?tag=turbopack-230428.3#a64b0c13b08666537520d0c4d0fbcca07307876a" dependencies = [ "anyhow", "dotenvy", @@ -7092,7 +7092,7 @@ dependencies = [ [[package]] name = "turbo-tasks-fetch" version = "0.1.0" -source = "git+https://github.com/vercel/turbo.git?tag=turbopack-230427.3#0e9881f822a6854a2b0daaf550b5eab91fd56771" +source = "git+https://github.com/vercel/turbo.git?tag=turbopack-230428.3#a64b0c13b08666537520d0c4d0fbcca07307876a" dependencies = [ "anyhow", "indexmap", @@ -7109,7 +7109,7 @@ dependencies = [ [[package]] name = "turbo-tasks-fs" version = "0.1.0" -source = "git+https://github.com/vercel/turbo.git?tag=turbopack-230427.3#0e9881f822a6854a2b0daaf550b5eab91fd56771" +source = "git+https://github.com/vercel/turbo.git?tag=turbopack-230428.3#a64b0c13b08666537520d0c4d0fbcca07307876a" dependencies = [ "anyhow", "auto-hash-map", @@ -7138,7 +7138,7 @@ dependencies = [ [[package]] name = "turbo-tasks-hash" version = "0.1.0" -source = "git+https://github.com/vercel/turbo.git?tag=turbopack-230427.3#0e9881f822a6854a2b0daaf550b5eab91fd56771" +source = "git+https://github.com/vercel/turbo.git?tag=turbopack-230428.3#a64b0c13b08666537520d0c4d0fbcca07307876a" dependencies = [ "base16", "hex", @@ -7150,7 +7150,7 @@ dependencies = [ [[package]] name = "turbo-tasks-macros" version = "0.1.0" -source = "git+https://github.com/vercel/turbo.git?tag=turbopack-230427.3#0e9881f822a6854a2b0daaf550b5eab91fd56771" +source = "git+https://github.com/vercel/turbo.git?tag=turbopack-230428.3#a64b0c13b08666537520d0c4d0fbcca07307876a" dependencies = [ "anyhow", "convert_case 0.6.0", @@ -7164,7 +7164,7 @@ dependencies = [ [[package]] name = "turbo-tasks-macros-shared" version = "0.1.0" -source = "git+https://github.com/vercel/turbo.git?tag=turbopack-230427.3#0e9881f822a6854a2b0daaf550b5eab91fd56771" +source = "git+https://github.com/vercel/turbo.git?tag=turbopack-230428.3#a64b0c13b08666537520d0c4d0fbcca07307876a" dependencies = [ "proc-macro2", "quote", @@ -7174,7 +7174,7 @@ dependencies = [ [[package]] name = "turbo-tasks-memory" version = "0.1.0" -source = "git+https://github.com/vercel/turbo.git?tag=turbopack-230427.3#0e9881f822a6854a2b0daaf550b5eab91fd56771" +source = "git+https://github.com/vercel/turbo.git?tag=turbopack-230428.3#a64b0c13b08666537520d0c4d0fbcca07307876a" dependencies = [ "anyhow", "auto-hash-map", @@ -7196,7 +7196,7 @@ dependencies = [ [[package]] name = "turbo-tasks-testing" version = "0.1.0" -source = "git+https://github.com/vercel/turbo.git?tag=turbopack-230427.3#0e9881f822a6854a2b0daaf550b5eab91fd56771" +source = "git+https://github.com/vercel/turbo.git?tag=turbopack-230428.3#a64b0c13b08666537520d0c4d0fbcca07307876a" dependencies = [ "anyhow", "auto-hash-map", @@ -7208,7 +7208,7 @@ dependencies = [ [[package]] name = "turbopack" version = "0.1.0" -source = "git+https://github.com/vercel/turbo.git?tag=turbopack-230427.3#0e9881f822a6854a2b0daaf550b5eab91fd56771" +source = "git+https://github.com/vercel/turbo.git?tag=turbopack-230428.3#a64b0c13b08666537520d0c4d0fbcca07307876a" dependencies = [ "anyhow", "async-recursion", @@ -7237,7 +7237,7 @@ dependencies = [ [[package]] name = "turbopack-bench" version = "0.1.0" -source = "git+https://github.com/vercel/turbo.git?tag=turbopack-230427.3#0e9881f822a6854a2b0daaf550b5eab91fd56771" +source = "git+https://github.com/vercel/turbo.git?tag=turbopack-230428.3#a64b0c13b08666537520d0c4d0fbcca07307876a" dependencies = [ "anyhow", "chromiumoxide", @@ -7267,7 +7267,7 @@ dependencies = [ [[package]] name = "turbopack-cli-utils" version = "0.1.0" -source = "git+https://github.com/vercel/turbo.git?tag=turbopack-230427.3#0e9881f822a6854a2b0daaf550b5eab91fd56771" +source = "git+https://github.com/vercel/turbo.git?tag=turbopack-230428.3#a64b0c13b08666537520d0c4d0fbcca07307876a" dependencies = [ "anyhow", "clap 4.1.11", @@ -7284,7 +7284,7 @@ dependencies = [ [[package]] name = "turbopack-core" version = "0.1.0" -source = "git+https://github.com/vercel/turbo.git?tag=turbopack-230427.3#0e9881f822a6854a2b0daaf550b5eab91fd56771" +source = "git+https://github.com/vercel/turbo.git?tag=turbopack-230428.3#a64b0c13b08666537520d0c4d0fbcca07307876a" dependencies = [ "anyhow", "async-trait", @@ -7311,7 +7311,7 @@ dependencies = [ [[package]] name = "turbopack-create-test-app" version = "0.1.0" -source = "git+https://github.com/vercel/turbo.git?tag=turbopack-230427.3#0e9881f822a6854a2b0daaf550b5eab91fd56771" +source = "git+https://github.com/vercel/turbo.git?tag=turbopack-230428.3#a64b0c13b08666537520d0c4d0fbcca07307876a" dependencies = [ "anyhow", "clap 4.1.11", @@ -7324,7 +7324,7 @@ dependencies = [ [[package]] name = "turbopack-css" version = "0.1.0" -source = "git+https://github.com/vercel/turbo.git?tag=turbopack-230427.3#0e9881f822a6854a2b0daaf550b5eab91fd56771" +source = "git+https://github.com/vercel/turbo.git?tag=turbopack-230428.3#a64b0c13b08666537520d0c4d0fbcca07307876a" dependencies = [ "anyhow", "async-trait", @@ -7346,7 +7346,7 @@ dependencies = [ [[package]] name = "turbopack-dev" version = "0.1.0" -source = "git+https://github.com/vercel/turbo.git?tag=turbopack-230427.3#0e9881f822a6854a2b0daaf550b5eab91fd56771" +source = "git+https://github.com/vercel/turbo.git?tag=turbopack-230428.3#a64b0c13b08666537520d0c4d0fbcca07307876a" dependencies = [ "anyhow", "indexmap", @@ -7367,7 +7367,7 @@ dependencies = [ [[package]] name = "turbopack-dev-server" version = "0.1.0" -source = "git+https://github.com/vercel/turbo.git?tag=turbopack-230427.3#0e9881f822a6854a2b0daaf550b5eab91fd56771" +source = "git+https://github.com/vercel/turbo.git?tag=turbopack-230428.3#a64b0c13b08666537520d0c4d0fbcca07307876a" dependencies = [ "anyhow", "async-compression", @@ -7401,7 +7401,7 @@ dependencies = [ [[package]] name = "turbopack-ecmascript" version = "0.1.0" -source = "git+https://github.com/vercel/turbo.git?tag=turbopack-230427.3#0e9881f822a6854a2b0daaf550b5eab91fd56771" +source = "git+https://github.com/vercel/turbo.git?tag=turbopack-230428.3#a64b0c13b08666537520d0c4d0fbcca07307876a" dependencies = [ "anyhow", "async-trait", @@ -7437,7 +7437,7 @@ dependencies = [ [[package]] name = "turbopack-ecmascript-plugins" version = "0.1.0" -source = "git+https://github.com/vercel/turbo.git?tag=turbopack-230427.3#0e9881f822a6854a2b0daaf550b5eab91fd56771" +source = "git+https://github.com/vercel/turbo.git?tag=turbopack-230428.3#a64b0c13b08666537520d0c4d0fbcca07307876a" dependencies = [ "anyhow", "serde", @@ -7451,7 +7451,7 @@ dependencies = [ [[package]] name = "turbopack-env" version = "0.1.0" -source = "git+https://github.com/vercel/turbo.git?tag=turbopack-230427.3#0e9881f822a6854a2b0daaf550b5eab91fd56771" +source = "git+https://github.com/vercel/turbo.git?tag=turbopack-230428.3#a64b0c13b08666537520d0c4d0fbcca07307876a" dependencies = [ "anyhow", "indexmap", @@ -7467,13 +7467,15 @@ dependencies = [ [[package]] name = "turbopack-image" version = "0.1.0" -source = "git+https://github.com/vercel/turbo.git?tag=turbopack-230427.3#0e9881f822a6854a2b0daaf550b5eab91fd56771" +source = "git+https://github.com/vercel/turbo.git?tag=turbopack-230428.3#a64b0c13b08666537520d0c4d0fbcca07307876a" dependencies = [ "anyhow", "base64 0.21.0", "image", "indexmap", "mime", + "once_cell", + "regex", "serde", "serde_with", "turbo-tasks", @@ -7485,7 +7487,7 @@ dependencies = [ [[package]] name = "turbopack-json" version = "0.1.0" -source = "git+https://github.com/vercel/turbo.git?tag=turbopack-230427.3#0e9881f822a6854a2b0daaf550b5eab91fd56771" +source = "git+https://github.com/vercel/turbo.git?tag=turbopack-230428.3#a64b0c13b08666537520d0c4d0fbcca07307876a" dependencies = [ "anyhow", "serde", @@ -7500,7 +7502,7 @@ dependencies = [ [[package]] name = "turbopack-mdx" version = "0.1.0" -source = "git+https://github.com/vercel/turbo.git?tag=turbopack-230427.3#0e9881f822a6854a2b0daaf550b5eab91fd56771" +source = "git+https://github.com/vercel/turbo.git?tag=turbopack-230428.3#a64b0c13b08666537520d0c4d0fbcca07307876a" dependencies = [ "anyhow", "mdxjs", @@ -7515,7 +7517,7 @@ dependencies = [ [[package]] name = "turbopack-node" version = "0.1.0" -source = "git+https://github.com/vercel/turbo.git?tag=turbopack-230427.3#0e9881f822a6854a2b0daaf550b5eab91fd56771" +source = "git+https://github.com/vercel/turbo.git?tag=turbopack-230428.3#a64b0c13b08666537520d0c4d0fbcca07307876a" dependencies = [ "anyhow", "async-stream", @@ -7549,7 +7551,7 @@ dependencies = [ [[package]] name = "turbopack-static" version = "0.1.0" -source = "git+https://github.com/vercel/turbo.git?tag=turbopack-230427.3#0e9881f822a6854a2b0daaf550b5eab91fd56771" +source = "git+https://github.com/vercel/turbo.git?tag=turbopack-230428.3#a64b0c13b08666537520d0c4d0fbcca07307876a" dependencies = [ "anyhow", "serde", @@ -7565,7 +7567,7 @@ dependencies = [ [[package]] name = "turbopack-swc-utils" version = "0.1.0" -source = "git+https://github.com/vercel/turbo.git?tag=turbopack-230427.3#0e9881f822a6854a2b0daaf550b5eab91fd56771" +source = "git+https://github.com/vercel/turbo.git?tag=turbopack-230428.3#a64b0c13b08666537520d0c4d0fbcca07307876a" dependencies = [ "swc_core", "turbo-tasks", @@ -7576,7 +7578,7 @@ dependencies = [ [[package]] name = "turbopack-test-utils" version = "0.1.0" -source = "git+https://github.com/vercel/turbo.git?tag=turbopack-230427.3#0e9881f822a6854a2b0daaf550b5eab91fd56771" +source = "git+https://github.com/vercel/turbo.git?tag=turbopack-230428.3#a64b0c13b08666537520d0c4d0fbcca07307876a" dependencies = [ "anyhow", "once_cell", diff --git a/Cargo.toml b/Cargo.toml index 195e602fee89..abf7f9d21086 100644 --- a/Cargo.toml +++ b/Cargo.toml @@ -42,11 +42,11 @@ swc_relay = { version = "0.2.5" } testing = { version = "0.33.4" } # Turbo crates -turbo-binding = { git = "https://github.com/vercel/turbo.git", tag = "turbopack-230427.3" } +turbo-binding = { git = "https://github.com/vercel/turbo.git", tag = "turbopack-230428.3" } # [TODO]: need to refactor embed_directory! macro usages, as well as resolving turbo_tasks::function, macros.. -turbo-tasks = { git = "https://github.com/vercel/turbo.git", tag = "turbopack-230427.3" } +turbo-tasks = { git = "https://github.com/vercel/turbo.git", tag = "turbopack-230428.3" } # [TODO]: need to refactor embed_directory! macro usage in next-core -turbo-tasks-fs = { git = "https://github.com/vercel/turbo.git", tag = "turbopack-230427.3" } +turbo-tasks-fs = { git = "https://github.com/vercel/turbo.git", tag = "turbopack-230428.3" } # General Deps diff --git a/packages/next-swc/crates/next-core/js/package.json b/packages/next-swc/crates/next-core/js/package.json index 3e2e2b1ac21f..8115ac102754 100644 --- a/packages/next-swc/crates/next-core/js/package.json +++ b/packages/next-swc/crates/next-core/js/package.json @@ -10,8 +10,8 @@ "check": "tsc --noEmit" }, "dependencies": { - "@vercel/turbopack-dev": "https://gitpkg.vercel.app/vercel/turbo/crates/turbopack-dev/js?turbopack-230427.3", - "@vercel/turbopack-node": "https://gitpkg.vercel.app/vercel/turbo/crates/turbopack-node/js?turbopack-230427.3", + "@vercel/turbopack-dev": "https://gitpkg.vercel.app/vercel/turbo/crates/turbopack-dev/js?turbopack-230428.3", + "@vercel/turbopack-node": "https://gitpkg.vercel.app/vercel/turbo/crates/turbopack-node/js?turbopack-230428.3", "anser": "^2.1.1", "css.escape": "^1.5.1", "next": "*", diff --git a/packages/next-swc/crates/next-core/js/src/entry/app/hydrate.tsx b/packages/next-swc/crates/next-core/js/src/entry/app/hydrate.tsx index 2aecce7c0ac2..d713ab7e3157 100644 --- a/packages/next-swc/crates/next-core/js/src/entry/app/hydrate.tsx +++ b/packages/next-swc/crates/next-core/js/src/entry/app/hydrate.tsx @@ -4,6 +4,7 @@ import type { ReactElement } from 'react' import { version } from 'next/package.json' import { createFromReadableStream } from 'next/dist/compiled/react-server-dom-webpack/client' import { callServer } from 'next/dist/client/app-call-server' +import { linkGc } from 'next/dist/client/app-link-gc' import { HeadManagerContext } from 'next/dist/shared/lib/head-manager-context' @@ -153,6 +154,8 @@ function hydrate() { ReactDOMClient.hydrateRoot(appElement, reactEl) }) } + + linkGc() } window.next = { diff --git a/packages/next-swc/crates/next-core/src/app_source.rs b/packages/next-swc/crates/next-core/src/app_source.rs index 9d75e3f9cc5b..cc79c10b2475 100644 --- a/packages/next-swc/crates/next-core/src/app_source.rs +++ b/packages/next-swc/crates/next-core/src/app_source.rs @@ -933,7 +933,6 @@ import {}, {{ chunks as {} }} from "COMPONENT_{}"; context.compile_time_info().environment(), ) .layer("ssr") - .css_chunk_root_path(server_root.join("_next/static/chunks")) .reference_chunk_source_maps(false) .build(); @@ -1013,7 +1012,6 @@ impl AppRouteVc { this.context.compile_time_info().environment(), ) .layer("ssr") - .css_chunk_root_path(this.server_root.join("_next/static/chunks")) .reference_chunk_source_maps(false) .build(); diff --git a/packages/next-swc/crates/next-core/src/next_client_component/with_client_chunks.rs b/packages/next-swc/crates/next-core/src/next_client_component/with_client_chunks.rs index 8daebdc29350..69f682705460 100644 --- a/packages/next-swc/crates/next-core/src/next_client_component/with_client_chunks.rs +++ b/packages/next-swc/crates/next-core/src/next_client_component/with_client_chunks.rs @@ -4,7 +4,7 @@ use turbo_binding::{ turbo::tasks_fs::FileSystemPathVc, turbopack::{ core::{ - asset::{Asset, AssetContentVc, AssetVc}, + asset::{Asset, AssetContentVc, AssetVc, AssetsVc}, chunk::{ availability_info::AvailabilityInfo, ChunkItem, ChunkItemVc, ChunkVc, ChunkableAsset, ChunkableAssetReference, ChunkableAssetReferenceVc, @@ -12,6 +12,7 @@ use turbo_binding::{ ChunkingTypeOptionVc, }, ident::AssetIdentVc, + proxied_asset::ProxiedAssetVc, reference::{ AssetReference, AssetReferenceVc, AssetReferencesVc, SingleAssetReferenceVc, }, @@ -116,14 +117,44 @@ struct WithClientChunksChunkItem { #[turbo_tasks::value_impl] impl WithClientChunksChunkItemVc { + #[turbo_tasks::function] + async fn chunks(self) -> Result { + let this = self.await?; + let inner = this.inner.await?; + Ok(this + .context + .chunk_group(inner.asset.as_root_chunk(this.context.into()))) + } + + #[turbo_tasks::function] + async fn client_chunks(self) -> Result { + let this = self.await?; + let inner = this.inner.await?; + let chunks = self.chunks(); + let output_root = this.context.output_root().await?; + + let mut client_chunks = Vec::new(); + for chunk in &*chunks.await? { + let extension = chunk.ident().path().extension().await?; + // Only expose CSS chunks as client chunks. + if &*extension == "css" { + if let Some(path) = output_root.get_path_to(&*chunk.ident().path().await?) { + client_chunks + .push(ProxiedAssetVc::new(*chunk, inner.server_root.join(path)).into()); + } + } + } + + Ok(AssetsVc::cell(client_chunks)) + } + #[turbo_tasks::function] async fn chunks_data(self) -> Result { let this = self.await?; let inner = this.inner.await?; Ok(ChunkDataVc::from_assets( inner.server_root, - this.context - .chunk_group(inner.asset.as_root_chunk(this.context.into())), + self.client_chunks(), )) } } @@ -188,17 +219,11 @@ impl ChunkItem for WithClientChunksChunkItem { .cell() .into(), ); - let group = this - .context - .chunk_group(inner.asset.as_root_chunk(this.context.into())); - let server_root = inner.server_root.await?; - let chunks = group.await?; + let client_chunks = self_vc.client_chunks(); + let client_chunks = client_chunks.await?; let client_chunk = StringVc::cell("client chunk".to_string()); - for &chunk in chunks.iter() { - let path = chunk.ident().path().await?; - if path.is_inside(&server_root) { - references.push(SingleAssetReferenceVc::new(chunk, client_chunk).into()); - } + for &chunk in client_chunks.iter() { + references.push(SingleAssetReferenceVc::new(chunk, client_chunk).into()); } for chunk_data in &*self_vc.chunks_data().await? { references.extend(chunk_data.references().await?.iter().copied()); diff --git a/packages/next/src/client/app-index.tsx b/packages/next/src/client/app-index.tsx index 591580a56b13..77a2d17f0c52 100644 --- a/packages/next/src/client/app-index.tsx +++ b/packages/next/src/client/app-index.tsx @@ -10,6 +10,7 @@ import { GlobalLayoutRouterContext } from '../shared/lib/app-router-context' import onRecoverableError from './on-recoverable-error' import { callServer } from './app-call-server' import { isNextRouterError } from './components/is-next-router-error' +import { linkGc } from './app-link-gc' // Since React doesn't call onerror for errors caught in error boundaries. const origConsoleError = window.console.error @@ -297,55 +298,5 @@ export function hydrate() { reactRoot.render(reactEl) } - // TODO-APP: Remove this logic when Float has GC built-in in development. - if (process.env.NODE_ENV !== 'production') { - const callback = (mutationList: MutationRecord[]) => { - for (const mutation of mutationList) { - if (mutation.type === 'childList') { - for (const node of mutation.addedNodes) { - if ( - 'tagName' in node && - (node as HTMLLinkElement).tagName === 'LINK' - ) { - const link = node as HTMLLinkElement - if (link.dataset.precedence === 'next.js') { - const href = link.getAttribute('href') - if (href) { - const [resource, version] = href.split('?v=') - if (version) { - const allLinks = document.querySelectorAll( - `link[href^="${resource}"]` - ) as NodeListOf - for (const otherLink of allLinks) { - if (otherLink.dataset.precedence === 'next.js') { - const otherHref = otherLink.getAttribute('href') - if (otherHref) { - const [, otherVersion] = otherHref.split('?v=') - if (!otherVersion || +otherVersion < +version) { - otherLink.remove() - const preloadLink = document.querySelector( - `link[rel="preload"][as="style"][href="${otherHref}"]` - ) - if (preloadLink) { - preloadLink.remove() - } - } - } - } - } - } - } - } - } - } - } - } - } - - // Create an observer instance linked to the callback function - const observer = new MutationObserver(callback) - observer.observe(document.head, { - childList: true, - }) - } + linkGc() } diff --git a/packages/next/src/client/app-link-gc.ts b/packages/next/src/client/app-link-gc.ts new file mode 100644 index 000000000000..faacd087aec5 --- /dev/null +++ b/packages/next/src/client/app-link-gc.ts @@ -0,0 +1,53 @@ +export function linkGc() { + // TODO-APP: Remove this logic when Float has GC built-in in development. + if (process.env.NODE_ENV !== 'production') { + const callback = (mutationList: MutationRecord[]) => { + for (const mutation of mutationList) { + if (mutation.type === 'childList') { + for (const node of mutation.addedNodes) { + if ( + 'tagName' in node && + (node as HTMLLinkElement).tagName === 'LINK' + ) { + const link = node as HTMLLinkElement + if (link.dataset.precedence === 'next.js') { + const href = link.getAttribute('href') + if (href) { + const [resource, version] = href.split('?v=') + if (version) { + const allLinks = document.querySelectorAll( + `link[href^="${resource}"]` + ) as NodeListOf + for (const otherLink of allLinks) { + if (otherLink.dataset.precedence === 'next.js') { + const otherHref = otherLink.getAttribute('href') + if (otherHref) { + const [, otherVersion] = otherHref.split('?v=') + if (!otherVersion || +otherVersion < +version) { + otherLink.remove() + const preloadLink = document.querySelector( + `link[rel="preload"][as="style"][href="${otherHref}"]` + ) + if (preloadLink) { + preloadLink.remove() + } + } + } + } + } + } + } + } + } + } + } + } + } + + // Create an observer instance linked to the callback function + const observer = new MutationObserver(callback) + observer.observe(document.head, { + childList: true, + }) + } +} diff --git a/pnpm-lock.yaml b/pnpm-lock.yaml index c1868f94b25d..9f600c6701e9 100644 --- a/pnpm-lock.yaml +++ b/pnpm-lock.yaml @@ -1018,8 +1018,8 @@ importers: '@types/react': 18.0.37 '@types/react-dom': 18.0.11 '@vercel/ncc': ^0.36.0 - '@vercel/turbopack-dev': https://gitpkg.vercel.app/vercel/turbo/crates/turbopack-dev/js?turbopack-230427.3 - '@vercel/turbopack-node': https://gitpkg.vercel.app/vercel/turbo/crates/turbopack-node/js?turbopack-230427.3 + '@vercel/turbopack-dev': https://gitpkg.vercel.app/vercel/turbo/crates/turbopack-dev/js?turbopack-230428.3 + '@vercel/turbopack-node': https://gitpkg.vercel.app/vercel/turbo/crates/turbopack-node/js?turbopack-230428.3 anser: ^2.1.1 css.escape: ^1.5.1 find-up: ^6.3.0 @@ -1031,8 +1031,8 @@ importers: stacktrace-parser: ^0.1.10 strip-ansi: ^7.0.1 dependencies: - '@vercel/turbopack-dev': '@gitpkg.vercel.app/vercel/turbo/crates/turbopack-dev/js?turbopack-230427.3_react-refresh@0.12.0' - '@vercel/turbopack-node': '@gitpkg.vercel.app/vercel/turbo/crates/turbopack-node/js?turbopack-230427.3' + '@vercel/turbopack-dev': '@gitpkg.vercel.app/vercel/turbo/crates/turbopack-dev/js?turbopack-230428.3_react-refresh@0.12.0' + '@vercel/turbopack-node': '@gitpkg.vercel.app/vercel/turbo/crates/turbopack-node/js?turbopack-230428.3' anser: 2.1.1 css.escape: 1.5.1 next: link:../../../../next @@ -6002,7 +6002,7 @@ packages: dependencies: '@mdx-js/mdx': 2.2.1 source-map: 0.7.3 - webpack: 5.74.0 + webpack: 5.74.0_@swc+core@1.3.55 transitivePeerDependencies: - supports-color @@ -6672,7 +6672,6 @@ packages: cpu: [arm64] os: [darwin] requiresBuild: true - dev: true optional: true /@swc/core-darwin-x64/1.3.55: @@ -6681,7 +6680,6 @@ packages: cpu: [x64] os: [darwin] requiresBuild: true - dev: true optional: true /@swc/core-linux-arm-gnueabihf/1.3.55: @@ -6690,7 +6688,6 @@ packages: cpu: [arm] os: [linux] requiresBuild: true - dev: true optional: true /@swc/core-linux-arm64-gnu/1.3.55: @@ -6699,7 +6696,6 @@ packages: cpu: [arm64] os: [linux] requiresBuild: true - dev: true optional: true /@swc/core-linux-arm64-musl/1.3.55: @@ -6708,7 +6704,6 @@ packages: cpu: [arm64] os: [linux] requiresBuild: true - dev: true optional: true /@swc/core-linux-x64-gnu/1.3.55: @@ -6717,7 +6712,6 @@ packages: cpu: [x64] os: [linux] requiresBuild: true - dev: true optional: true /@swc/core-linux-x64-musl/1.3.55: @@ -6726,7 +6720,6 @@ packages: cpu: [x64] os: [linux] requiresBuild: true - dev: true optional: true /@swc/core-win32-arm64-msvc/1.3.55: @@ -6735,7 +6728,6 @@ packages: cpu: [arm64] os: [win32] requiresBuild: true - dev: true optional: true /@swc/core-win32-ia32-msvc/1.3.55: @@ -6744,7 +6736,6 @@ packages: cpu: [ia32] os: [win32] requiresBuild: true - dev: true optional: true /@swc/core-win32-x64-msvc/1.3.55: @@ -6753,7 +6744,6 @@ packages: cpu: [x64] os: [win32] requiresBuild: true - dev: true optional: true /@swc/core/1.3.55_@swc+helpers@0.5.1: @@ -6778,7 +6768,6 @@ packages: '@swc/core-win32-arm64-msvc': 1.3.55 '@swc/core-win32-ia32-msvc': 1.3.55 '@swc/core-win32-x64-msvc': 1.3.55 - dev: true /@swc/helpers/0.4.14: resolution: {integrity: sha512-4C7nX/dvpzB7za4Ql9K81xK3HPxCpHMgwTZVyf+9JQ6VUbn9jjZVN7/Nkdz/Ugzs2CSjqnL/UPXroiVBVHUWUw==} @@ -23775,7 +23764,6 @@ packages: source-map: 0.6.1 terser: 5.14.1 webpack: 5.74.0_@swc+core@1.3.55 - dev: true /terser-webpack-plugin/5.2.4_webpack@5.74.0: resolution: {integrity: sha512-E2CkNMN+1cho04YpdANyRrn8CyN4yMy+WdFKZIySFZrGXZxJwJP6PMNGGc/Mcr6qygQHUUqRxnAPmi0M9f00XA==} @@ -25181,7 +25169,6 @@ packages: - '@swc/core' - esbuild - uglify-js - dev: true /websocket-driver/0.7.3: resolution: {integrity: sha512-bpxWlvbbB459Mlipc5GBzzZwhoZgGEZLuqPaR0INBGnPAY1vdBX6hPnoFXiw+3yWxDuHyQjO2oXTMyS8A5haFg==} @@ -25587,9 +25574,9 @@ packages: /zwitch/2.0.4: resolution: {integrity: sha512-bXE4cR/kVZhKZX/RjPEflHaKVhUVl85noU3v6b8apfQEc1x4A+zBxjZ4lN8LqGd6WZ3dl98pY4o717VFmoPp+A==} - '@gitpkg.vercel.app/vercel/turbo/crates/turbopack-dev/js?turbopack-230427.3_react-refresh@0.12.0': - resolution: {tarball: https://gitpkg.vercel.app/vercel/turbo/crates/turbopack-dev/js?turbopack-230427.3} - id: '@gitpkg.vercel.app/vercel/turbo/crates/turbopack-dev/js?turbopack-230427.3' + '@gitpkg.vercel.app/vercel/turbo/crates/turbopack-dev/js?turbopack-230428.3_react-refresh@0.12.0': + resolution: {tarball: https://gitpkg.vercel.app/vercel/turbo/crates/turbopack-dev/js?turbopack-230428.3} + id: '@gitpkg.vercel.app/vercel/turbo/crates/turbopack-dev/js?turbopack-230428.3' name: '@vercel/turbopack-dev' version: 0.0.0 dependencies: @@ -25599,8 +25586,8 @@ packages: - webpack dev: false - '@gitpkg.vercel.app/vercel/turbo/crates/turbopack-node/js?turbopack-230427.3': - resolution: {tarball: https://gitpkg.vercel.app/vercel/turbo/crates/turbopack-node/js?turbopack-230427.3} + '@gitpkg.vercel.app/vercel/turbo/crates/turbopack-node/js?turbopack-230428.3': + resolution: {tarball: https://gitpkg.vercel.app/vercel/turbo/crates/turbopack-node/js?turbopack-230428.3} name: '@vercel/turbopack-node' version: 0.0.0 dependencies: