diff --git a/packages/next/next-server/lib/utils.ts b/packages/next/next-server/lib/utils.ts
index cbd63712b0e64..ebc6712f1e00d 100644
--- a/packages/next/next-server/lib/utils.ts
+++ b/packages/next/next-server/lib/utils.ts
@@ -169,6 +169,7 @@ export type DocumentProps = DocumentInitialProps & {
htmlProps: any
bodyTags: any[]
headTags: any[]
+ unstable_runtimeJS?: false
}
/**
diff --git a/packages/next/next-server/server/render.tsx b/packages/next/next-server/server/render.tsx
index e30f5423c2933..69ff90700551c 100644
--- a/packages/next/next-server/server/render.tsx
+++ b/packages/next/next-server/server/render.tsx
@@ -159,6 +159,7 @@ export type RenderOptsPartial = {
params?: ParsedUrlQuery
previewProps: __ApiPreviewProps
basePath: string
+ unstable_runtimeJS?: false
}
export type RenderOpts = LoadComponentsReturnType & RenderOptsPartial
@@ -200,6 +201,7 @@ function renderDocument(
customServer,
gip,
appGip,
+ unstable_runtimeJS,
}: RenderOpts & {
props: any
docProps: DocumentInitialProps
@@ -268,6 +270,7 @@ function renderDocument(
htmlProps,
bodyTags,
headTags,
+ unstable_runtimeJS,
...docProps,
})}
@@ -772,6 +775,11 @@ export async function renderToHTML(
let html = renderDocument(Document, {
...renderOpts,
+ // Only enabled in production as development mode has features relying on HMR (style injection for example)
+ unstable_runtimeJS:
+ process.env.NODE_ENV === 'production'
+ ? pageConfig.unstable_runtimeJS
+ : undefined,
dangerousAsPath: router.asPath,
ampState,
props,
diff --git a/packages/next/pages/_document.tsx b/packages/next/pages/_document.tsx
index 9014be2d30644..1a078a14a2766 100644
--- a/packages/next/pages/_document.tsx
+++ b/packages/next/pages/_document.tsx
@@ -304,7 +304,9 @@ export class Head extends Component<
__NEXT_DATA__,
dangerousAsPath,
headTags,
+ unstable_runtimeJS,
} = this.context._documentProps
+ const disableRuntimeJS = unstable_runtimeJS === false
const { _devOnlyInvalidateCacheQueryString } = this.context
const { page, buildId } = __NEXT_DATA__
@@ -490,7 +492,7 @@ export class Head extends Component<
/>
)}
{this.getCssLinks()}
- {page !== '/_error' && (
+ {!disableRuntimeJS && page !== '/_error' && (
)}
-
- {this.getPreloadDynamicChunks()}
- {this.getPreloadMainLinks()}
+ {!disableRuntimeJS && (
+
+ )}
+ {!disableRuntimeJS && this.getPreloadDynamicChunks()}
+ {!disableRuntimeJS && this.getPreloadMainLinks()}
{this.context._documentProps.isDevelopment &&
this.context._documentProps.hasCssMode && (
// this element is used to mount development styles so the
@@ -532,7 +536,7 @@ export class Head extends Component<
{styles || null}
>
)}
- {this.getFidPolyfill()}
+ {!disableRuntimeJS && this.getFidPolyfill()}
{React.createElement(React.Fragment, {}, ...(headTags || []))}
)
@@ -669,7 +673,9 @@ export class NextScript extends Component {
devFiles,
__NEXT_DATA__,
bodyTags,
+ unstable_runtimeJS,
} = this.context._documentProps
+ const disableRuntimeJS = unstable_runtimeJS === false
const { _devOnlyInvalidateCacheQueryString } = this.context
@@ -790,7 +796,7 @@ export class NextScript extends Component {
return (
<>
- {devFiles
+ {!disableRuntimeJS && devFiles
? devFiles.map(
(file: string) =>
!file.match(/\.js\.map/) && (
@@ -818,7 +824,7 @@ export class NextScript extends Component {
}}
/>
)}
- {process.env.__NEXT_MODERN_BUILD ? (
+ {process.env.__NEXT_MODERN_BUILD && !disableRuntimeJS ? (