This PR will enable minifying the *server* part of the user code by default when running `next build`.
## Explanation
Next.js compiles two versions of your code: the client version for the app that runs in the browser, and the server for the code that will run on the server. Whilst the client code has always been minified and optimised, we haven't done so historically for the server side.
## How does this impact me?
There are several consequences to this change:
- minified code makes error stacks less readable. To fix that, you can use source maps, which you can enable with `experimental.serverSourceMaps`. This is not enabled by default as this is an expensive operation.
- however the server code will be optimised for size so as a result, cold boots should improve
## opting out
you can opt out via specifying `experimental.serverMinification: false` in `next.config.js`
In dev mode, we're using a catch-all route for dynamic metadata routes, e.g. page path `/twitter-image` would become `/twitter-image/[[...metadata_id...]]/route` as a dynamic custom app route.
But we're missing to convert it in filesystem scanning for routing purpose, adding the metadata related normalizing logic for app page to align with other places.
This PR introduces a change in the Next.js server that should improve memory usage nicely during dev.
## How
While investigating the repro cases in #54708, @timneutkens and I noticed that the high memory usage often involved `googleapis`. Digging a bit more, I also saw that in dev, the bundle generated for a page using `googleapis` was around 80MB and that requiring it in Node.js increased memory by 160MB 🥲 and that requiring another page that also used this also increased the memory by 160MB.
The problem is that Next.js, on new navigations and hot reloads, might need to load/reload all the code required for the page *all the time*. This issue is also exacerbated by the fact that there's a nasty Node.js bug that makes it impossible to clean that memory up, leading to memory bloat and overall a pretty bad DX.
So if we can't clean this up, what can we do about it?
The change I'm introducing in this PR is that I'm changing Next.js in order to split the code you're using from `node_modules` from the code you've written in different chunks. The idea is that the heavy code you're loading from `node_modules` is only gonna be loaded once per session this time.
This should make a navigation/page reload only load the user bundle now. On my simple test case, the cost of navigation went from ~200MB to ~40MB.
A few notes on the implementation:
- The chunks for the `node_modules` are split at the module level, this is to ensure that each of the node_modules dependencies is split in the most memory efficient manner. If it was a big monolithic chunk, it would potentially be reloaded again and again whenever reloaded, leading to leakage.
- I'm guessing we could do the same for the Edge server
- the first load for a page will still be fairly heavy memory wise, there's probably something else we can do there
- there's also an issue with the webpack require cache being flushed, whereas it could be reused
## comparisons
### navigating a page
before
<img width="284" alt="CleanShot 2023-09-04 at 21 00 46@2x" src="https://github.com/vercel/next.js/assets/11064311/44e37df8-4414-4ca1-b6bf-fb0fb11751ea">
after
<img width="392" alt="CleanShot 2023-09-04 at 20 58 53@2x" src="https://github.com/vercel/next.js/assets/11064311/46226123-a73a-4132-a99d-fb812e59df46">
When using page routes we need to pass the contents of the `export const config` to the `extraConfig` populating the functions config manifest rather then relying on named exports like in app router.
### 🧐 What's in there?
As discussed with @huozhi, it's restoring code from #52393 which I forgot to restore in #54891.
It is unlikely to make a difference, but we'll set globalWindow based on the desired test environment. This will not make any difference for most people.
### 🧪 How to test?
Once you've rebuilt your local version of Next, `pnpm testheadless jest/rsc`
Co-authored-by: Jiachi Liu <4800338+huozhi@users.noreply.github.com>
This bumps `undici` to the latest version to match the one used in newer Node.js versions', potentially fixing compatibility issues.
I also cleaned up some related `global as any` usage.
Ports content from the Pages and Layouts section about templates and formats to match other API reference pages.
Co-authored-by: Michael Novotny <446260+manovotny@users.noreply.github.com>
While investigating the HMR event types I noticed `pong` is not being used in Pages Router nor in App Router.
This PR removes the code that sends it as it's essentially dead code.
Adds `serverError` to the list of HMR actions, missed this in the earlier PRs as it wasn't using `hotReloader.send`.
Also ensures on-demand-entry-handler reuses the hotReloader.send method.
Ensures only one name is used for the event, makes it easier to search for, going to replace this with the constant like the other events in a follow-up PR but this can be landed as-is.
The original logic here was introduced to unblock client side navigations if a server action was in flight, however this introduced a bug where subsequent actions would fetch twice after navigation.
This was happening because the promise handling was in the wrong spot: previously this would potentially cause both the `then` callback to fire while simultaneously the action reducer would handle the result. Moving it to where we're first checking if there's a pending navigation will more reliably indicate if the action was resolved after we discarded it in the reducer.
Closes NEXT-1589
Fixes#54746
For group routes, as their custom layout show up at the 1st level of the loader tree, so previously we tried to add the default not-found to that layer, but if they have custom root not-found, we should use that as the root not-found componeny, instead of using default not-found component to form the 404 page
Closes NEXT-1588
Fixes#51075Fixes#54892
This fix ensures the case that if you `import { foo } from './index'`,
where:
index.js:
```js
export * from './subpkg'
```
subpkg.js:
```js
const unrelatedExpressions = ...
export { foo } from './foo'
export { bar } from './bar'
```
Previously we'll transform the proxy to the second module to `export {
foo } from './subpkg'`. With this fix it will be correctly optimized as
`export { foo } from './foo'` which is a shorter path.
First part adding additional types for the various events that are sent through the websocket to the browser.
Will add additional details / comments on the types after landing these changes in the browser-side code too.
> Layouts do not have access to the current route segment(s). To access route segments, you can use useSelectedLayoutSegment or useSelectedLayoutSegments in a Client Component.
The term "current" is confusing.
It should be only the route segments under the layout. For example: `app/layout.tsx` can not access `app/[slug]`.
Missing word in client component page in docs when discussing the effect of "use client" on a client component's children and imported components. Not sure if 'children' is the appropriate word or whether there should be a reference to imported components too.
Update the code snippet for configuring API Routes to include `maxDuration` as an option.
Co-authored-by: Lee Robinson <9113740+leerob@users.noreply.github.com>
### What?
Follow-up of #54824
### Why?
Correctly detect the section to look for while autolabeling. The text currently being searched is not present in the issue body, just the template. Example: #54911 where "App Router" is present but was not detected.
This:
- Profiles dev server startup by wrapping most logic in a debug tracing Span
- Sets tracing globals for this case earlier, as they would otherwise be unavailable
- Allows Turbopack traces to be uploaded, as while currently incomplete, they are accurate
Closes WEB-1440
Co-authored-by: Jiachi Liu <4800338+huozhi@users.noreply.github.com>
Simplified some logic around `getPagePaths` as well as another normalization function. This instead utilized some flat arrays using push instead of relying on a separate `flatten` method (allowing us to remove it). This also reduced the number of logic checks for this generation.
