From c4d927fdf09e415d18c81f4fe32f72ac3dc36390 Mon Sep 17 00:00:00 2001 From: Jiachi Liu Date: Thu, 22 Sep 2022 00:33:58 +0200 Subject: [PATCH 1/4] Strip internal pages for pagesDir in app edge ssr --- packages/next/build/webpack-config.ts | 2 +- .../loaders/next-edge-ssr-loader/index.ts | 19 ++++++++++++------- .../loaders/next-edge-ssr-loader/render.ts | 6 +++++- test/.stats-app/app/app-edge-ssr/page.js | 7 +++++++ test/.stats-app/next.config.js | 9 +++++++++ test/.stats-app/package.json | 4 ++-- test/.stats-app/pages/edge-ssr.js | 6 ------ 7 files changed, 36 insertions(+), 17 deletions(-) create mode 100644 test/.stats-app/app/app-edge-ssr/page.js create mode 100644 test/.stats-app/next.config.js diff --git a/packages/next/build/webpack-config.ts b/packages/next/build/webpack-config.ts index 07cc82f4b4ab1..db71cbc61ea5c 100644 --- a/packages/next/build/webpack-config.ts +++ b/packages/next/build/webpack-config.ts @@ -1401,7 +1401,7 @@ export default async function getBaseWebpackConfig( runtimeChunk: isClient ? { name: CLIENT_STATIC_FILES_RUNTIME_WEBPACK } : undefined, - minimize: !dev && isClient, + minimize: !dev && (isClient || isEdgeServer), minimizer: [ // Minify JavaScript (compiler: webpack.Compiler) => { diff --git a/packages/next/build/webpack/loaders/next-edge-ssr-loader/index.ts b/packages/next/build/webpack/loaders/next-edge-ssr-loader/index.ts index 1a1dc07d23106..889a9ebe8bdff 100644 --- a/packages/next/build/webpack/loaders/next-edge-ssr-loader/index.ts +++ b/packages/next/build/webpack/loaders/next-edge-ssr-loader/index.ts @@ -68,29 +68,33 @@ export default async function edgeSSRLoader(this: any) { import { adapter, enhanceGlobals } from 'next/dist/server/web/adapter' import { getRender } from 'next/dist/build/webpack/loaders/next-edge-ssr-loader/render' - import Document from ${stringifiedDocumentPath} - enhanceGlobals() + const pageType = ${JSON.stringify(pagesType)} ${ isAppDir ? ` + const Document = null const appRenderToHTML = require('next/dist/server/app-render').renderToHTMLOrFlight const pagesRenderToHTML = null const pageMod = require(${JSON.stringify(pageModPath)}) + const appMod = null + const errorMod = null + const error500Mod = null ` : ` + const Document = require(${stringifiedDocumentPath}).default const appRenderToHTML = null const pagesRenderToHTML = require('next/dist/server/render').renderToHTML const pageMod = require(${stringifiedPagePath}) + const appMod = require(${stringifiedAppPath}) + const errorMod = require(${stringifiedErrorPath}) + const error500Mod = ${ + stringified500Path ? `require(${stringified500Path})` : 'null' + } ` } - const appMod = require(${stringifiedAppPath}) - const errorMod = require(${stringifiedErrorPath}) - const error500Mod = ${ - stringified500Path ? `require(${stringified500Path})` : 'null' - } const buildManifest = self.__BUILD_MANIFEST const reactLoadableManifest = self.__REACT_LOADABLE_MANIFEST @@ -101,6 +105,7 @@ export default async function edgeSSRLoader(this: any) { } const render = getRender({ + pageType, dev: ${dev}, page: ${JSON.stringify(page)}, appMod, diff --git a/packages/next/build/webpack/loaders/next-edge-ssr-loader/render.ts b/packages/next/build/webpack/loaders/next-edge-ssr-loader/render.ts index 30ac4851283d9..128ccbe478250 100644 --- a/packages/next/build/webpack/loaders/next-edge-ssr-loader/render.ts +++ b/packages/next/build/webpack/loaders/next-edge-ssr-loader/render.ts @@ -17,6 +17,7 @@ export function getRender({ pageMod, errorMod, error500Mod, + pagesType, Document, buildManifest, reactLoadableManifest, @@ -28,6 +29,7 @@ export function getRender({ config, buildId, }: { + pagesType?: 'app' | 'pages' | 'root' dev: boolean page: string appMod: any @@ -46,13 +48,14 @@ export function getRender({ config: NextConfig buildId: string }) { + const isAppPath = pagesType === 'app' const baseLoadComponentResult = { dev, buildManifest, reactLoadableManifest, subresourceIntegrityManifest, Document, - App: appMod.default as AppType, + App: appMod?.default as AppType, } const server = new WebServer({ @@ -72,6 +75,7 @@ export function getRender({ appRenderToHTML, pagesRenderToHTML, loadComponent: async (pathname) => { + if (isAppPath) return null if (pathname === page) { return { ...baseLoadComponentResult, diff --git a/test/.stats-app/app/app-edge-ssr/page.js b/test/.stats-app/app/app-edge-ssr/page.js new file mode 100644 index 0000000000000..20e49c40a12cc --- /dev/null +++ b/test/.stats-app/app/app-edge-ssr/page.js @@ -0,0 +1,7 @@ +export default function page() { + return 'edge-ssr' +} + +export const config = { + runtime: 'experimental-edge', +} diff --git a/test/.stats-app/next.config.js b/test/.stats-app/next.config.js new file mode 100644 index 0000000000000..3b9bfdac02772 --- /dev/null +++ b/test/.stats-app/next.config.js @@ -0,0 +1,9 @@ +const withBundleAnalyzer = require('@next/bundle-analyzer')({ + enabled: !!process.env.TEST_ANALYZE, +}) + +module.exports = withBundleAnalyzer({ + experimental: { + appDir: true, + }, +}) diff --git a/test/.stats-app/package.json b/test/.stats-app/package.json index 5ed2c313a0cc1..374d524426a5d 100644 --- a/test/.stats-app/package.json +++ b/test/.stats-app/package.json @@ -4,7 +4,7 @@ "license": "MIT", "dependencies": { "next": "latest", - "react": "18.2.0", - "react-dom": "18.2.0" + "react": "experimental", + "react-dom": "experimental" } } diff --git a/test/.stats-app/pages/edge-ssr.js b/test/.stats-app/pages/edge-ssr.js index f92742cc52817..20e49c40a12cc 100644 --- a/test/.stats-app/pages/edge-ssr.js +++ b/test/.stats-app/pages/edge-ssr.js @@ -2,12 +2,6 @@ export default function page() { return 'edge-ssr' } -export async function getServerSideProps() { - return { - props: {}, - } -} - export const config = { runtime: 'experimental-edge', } From 9ef4c88d86516a0318a580ad70f9b97c3801019b Mon Sep 17 00:00:00 2001 From: Jiachi Liu Date: Thu, 22 Sep 2022 00:40:14 +0200 Subject: [PATCH 2/4] add stats display for app ssr bundle --- test/.stats-app/stats-config.js | 6 +++++- 1 file changed, 5 insertions(+), 1 deletion(-) diff --git a/test/.stats-app/stats-config.js b/test/.stats-app/stats-config.js index c6e87308db9d8..5e44aea489c2a 100644 --- a/test/.stats-app/stats-config.js +++ b/test/.stats-app/stats-config.js @@ -32,9 +32,13 @@ const clientGlobs = [ globs: ['fetched-pages/**/*.html'], }, { - name: 'Edge SSR Page bundle Size', + name: 'Pages edge SSR bundle Size', globs: ['.next/server/pages/edge-ssr.js'], }, + { + name: 'App edge SSR bundle Size', + globs: ['.next/server/app/app-edge-ssr/page.js'], + }, { name: 'Middleware size', globs: [ From c49f6a2108e926cfec4539c2b93a0a564dfb4362 Mon Sep 17 00:00:00 2001 From: Jiachi Liu Date: Thu, 22 Sep 2022 01:09:37 +0200 Subject: [PATCH 3/4] loose restriction for pnpm install --- .github/actions/next-stats-action/src/run/index.js | 10 +++++++--- 1 file changed, 7 insertions(+), 3 deletions(-) diff --git a/.github/actions/next-stats-action/src/run/index.js b/.github/actions/next-stats-action/src/run/index.js index 09e5b3761a17d..5e332d4c9f6b2 100644 --- a/.github/actions/next-stats-action/src/run/index.js +++ b/.github/actions/next-stats-action/src/run/index.js @@ -253,9 +253,13 @@ async function linkPkgs(pkgDir = '', pkgPaths) { await fs.writeFile(pkgJsonPath, JSON.stringify(pkgData, null, 2), 'utf8') await fs.remove(yarnEnvValues.YARN_CACHE_FOLDER) - await exec(`cd ${pkgDir} && pnpm install`, false, { - env: yarnEnvValues, - }) + await exec( + `cd ${pkgDir} && pnpm install --strict-peer-dependencies=false`, + false, + { + env: yarnEnvValues, + } + ) } module.exports = runConfigs From 9f4f412cf05f407580d46d9e1578c711ae4da08b Mon Sep 17 00:00:00 2001 From: Jiachi Liu Date: Thu, 22 Sep 2022 01:43:57 +0200 Subject: [PATCH 4/4] update config files --- test/.stats-app/stats-config.js | 25 ++++++++++++++++++------- 1 file changed, 18 insertions(+), 7 deletions(-) diff --git a/test/.stats-app/stats-config.js b/test/.stats-app/stats-config.js index 5e44aea489c2a..58316e4a8ee6d 100644 --- a/test/.stats-app/stats-config.js +++ b/test/.stats-app/stats-config.js @@ -32,12 +32,11 @@ const clientGlobs = [ globs: ['fetched-pages/**/*.html'], }, { - name: 'Pages edge SSR bundle Size', - globs: ['.next/server/pages/edge-ssr.js'], - }, - { - name: 'App edge SSR bundle Size', - globs: ['.next/server/app/app-edge-ssr/page.js'], + name: 'Edge SSR bundle Size', + globs: [ + '.next/server/pages/edge-ssr.js', + '.next/server/app/app-edge-ssr/page.js', + ], }, { name: 'Middleware size', @@ -93,6 +92,9 @@ module.exports = { path: 'next.config.js', content: ` module.exports = { + experimental: { + appDir: true, + }, generateBuildId: () => 'BUILD_ID', webpack(config) { config.optimization.minimize = false @@ -113,7 +115,10 @@ module.exports = { { path: 'next.config.js', content: ` - module.exports = { + module.exports = { + experimental: { + appDir: true, + }, generateBuildId: () => 'BUILD_ID' } `, @@ -148,6 +153,9 @@ module.exports = { path: 'next.config.js', content: ` module.exports = { + experimental: { + appDir: true, + }, generateBuildId: () => 'BUILD_ID', swcMinify: true, webpack(config) { @@ -170,6 +178,9 @@ module.exports = { path: 'next.config.js', content: ` module.exports = { + experimental: { + appDir: true, + }, swcMinify: true, generateBuildId: () => 'BUILD_ID' }