Abstract deployment id access into module (#86727)

This also helps with persistent-caching performance, since fewer chunks change (only the ones containing this module, as opposed to the chunks containing all the users of the value)

Author: mischnic

packages/next/src/build/deployment-id.ts

@@ -19,7 +19,7 @@ import { getProxiedPluginState } from '../../build-context'
 import { WEBPACK_LAYERS } from '../../../lib/constants'
 import { normalizePagePath } from '../../../shared/lib/page-path/normalize-page-path'
 import { CLIENT_STATIC_FILES_RUNTIME_MAIN_APP } from '../../../shared/lib/constants'
-import { getDeploymentIdQueryOrEmptyString } from '../../deployment-id'
+import { getDeploymentIdQueryOrEmptyString } from '../../../shared/lib/deployment-id'
 import {
   formatBarrelOptimizedResource,
   getModuleReferencesInOrder,

packages/next/src/build/webpack/plugins/flight-manifest-plugin.ts

@@ -1,7 +1,7 @@
 // Override chunk URL mapping in the webpack runtime
 // https://github.com/webpack/webpack/blob/2738eebc7880835d88c727d364ad37f3ec557593/lib/RuntimeGlobals.js#L204
 
-import { getDeploymentIdQueryOrEmptyString } from '../build/deployment-id'
+import { getDeploymentIdQueryOrEmptyString } from '../shared/lib/deployment-id'
 import { encodeURIPath } from '../shared/lib/encode-uri-path'
 
 declare const __webpack_require__: any

packages/next/src/client/app-webpack.ts

@@ -46,6 +46,7 @@ import RootErrorBoundary from './errors/root-error-boundary'
 import DefaultGlobalError from './builtin/global-error'
 import { RootLayoutBoundary } from '../../lib/framework/boundary-components'
 import type { StaticIndicatorState } from '../dev/hot-reloader/app/hot-reloader-app'
+import { getDeploymentIdQueryOrEmptyString } from '../../shared/lib/deployment-id'
 
 const globalMutable: {
   pendingMpaPath?: string
@@ -622,9 +623,7 @@ function RuntimeStyles() {
     }
   }, [renderedStylesSize, forceUpdate])
 
-  const dplId = process.env.NEXT_DEPLOYMENT_ID
-    ? `?dpl=${process.env.NEXT_DEPLOYMENT_ID}`
-    : ''
+  const dplId = getDeploymentIdQueryOrEmptyString()
   return [...runtimeStyles].map((href, i) => (
     <link
       key={i}

packages/next/src/client/components/app-router.tsx

@@ -41,6 +41,7 @@ import {
   urlToUrlWithoutFlightMarker,
 } from '../../route-params'
 import type { NormalizedSearch } from '../segment-cache/cache-key'
+import { getDeploymentId } from '../../../shared/lib/deployment-id'
 
 const createFromReadableStream =
   createFromReadableStreamBrowser as (typeof import('react-server-dom-webpack/client.browser'))['createFromReadableStream']
@@ -329,8 +330,9 @@ export async function createFetch<T>(
     headers['Next-Test-Fetch-Priority'] = fetchPriority
   }
 
-  if (process.env.NEXT_DEPLOYMENT_ID) {
-    headers['x-deployment-id'] = process.env.NEXT_DEPLOYMENT_ID
+  const deploymentId = getDeploymentId()
+  if (deploymentId) {
+    headers['x-deployment-id'] = deploymentId
   }
 
   if (process.env.NODE_ENV !== 'production') {

packages/next/src/client/components/router-reducer/fetch-server-response.ts

@@ -56,6 +56,7 @@ import {
   omitUnusedArgs,
 } from '../../../../shared/lib/server-reference-info'
 import { revalidateEntireCache } from '../../segment-cache/cache'
+import { getDeploymentId } from '../../../../shared/lib/deployment-id'
 
 const createFromFetch =
   createFromFetchBrowser as (typeof import('react-server-dom-webpack/client.browser'))['createFromFetch']
@@ -110,8 +111,9 @@ async function fetchServerAction(
     ),
   }
 
-  if (process.env.NEXT_DEPLOYMENT_ID) {
-    headers['x-deployment-id'] = process.env.NEXT_DEPLOYMENT_ID
+  const deploymentId = getDeploymentId()
+  if (deploymentId) {
+    headers['x-deployment-id'] = deploymentId
   }
 
   if (nextUrl) {

packages/next/src/client/components/router-reducer/reducers/server-action-reducer.ts

@@ -3,7 +3,7 @@ import type { ProxyMatcher } from '../build/analysis/get-page-static-info'
 import getAssetPathFromRoute from '../shared/lib/router/utils/get-asset-path-from-route'
 import { __unsafeCreateTrustedScriptURL } from './trusted-types'
 import { requestIdleCallback } from './request-idle-callback'
-import { getDeploymentIdQueryOrEmptyString } from '../build/deployment-id'
+import { getDeploymentIdQueryOrEmptyString } from '../shared/lib/deployment-id'
 import { encodeURIPath } from '../shared/lib/encode-uri-path'
 
 // 3.8s was arbitrarily chosen as it's what https://web.dev/interactive

packages/next/src/client/route-loader.ts

@@ -1,11 +1,14 @@
 declare const __webpack_require__: any
 declare let __webpack_public_path__: string
 
-import { getDeploymentIdQueryOrEmptyString } from '../build/deployment-id'
+import {
+  getDeploymentId,
+  getDeploymentIdQueryOrEmptyString,
+} from '../shared/lib/deployment-id'
 
 // If we have a deployment ID, we need to append it to the webpack chunk names
 // I am keeping the process check explicit so this can be statically optimized
-if (process.env.NEXT_DEPLOYMENT_ID) {
+if (getDeploymentId()) {
   const suffix = getDeploymentIdQueryOrEmptyString()
   const getChunkScriptFilename = __webpack_require__.u
   __webpack_require__.u = (...args: any[]) =>

packages/next/src/client/webpack.ts

@@ -42,6 +42,7 @@ import type {
   GetStaticPaths,
   GetStaticProps,
 } from '../../../types'
+import { getDeploymentId } from '../../../shared/lib/deployment-id'
 
 export const getHandler = ({
   srcPage: originalSrcPage,
@@ -257,7 +258,7 @@ export const getHandler = ({
                     buildId,
                     customServer:
                       Boolean(routerServerContext?.isCustomServer) || undefined,
-                    deploymentId: process.env.NEXT_DEPLOYMENT_ID,
+                    deploymentId: getDeploymentId(),
                   },
                   renderOpts: {
                     params,

packages/next/src/server/route-modules/pages/pages-handler.ts

@@ -0,0 +1,13 @@
+// This could also be a variable instead of a function, but some unit tests want to change the ID at
+// runtime. Even though that would never happen in a real deployment.
+export function getDeploymentId(): string | undefined {
+  return process.env.NEXT_DEPLOYMENT_ID
+}
+
+export function getDeploymentIdQueryOrEmptyString(): string {
+  let deploymentId = getDeploymentId()
+  if (deploymentId) {
+    return `?dpl=${deploymentId}`
+  }
+  return ''
+}