Skip to content

Turbopack: hide useless method names #73586

New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Jump to bottom
Closed
wants to merge 1 commit into from
Closed

Turbopack: hide useless method names #73586

wants to merge 1 commit into from

Conversation

sokra
Copy link
Member

@sokra sokra commented Dec 6, 2024 •
edited by padmaia
Loading

What?

Hide confusing method names like @ eval @ {module evaluation} @ anonymous. They don't give any value and can overwhelm the user

Closes PACK-5225

@sokra sokra mentioned this pull request Dec 6, 2024
Merged
@sokra Graphite App
Copy link
Member Author

sokra commented Dec 6, 2024 •
edited by lukesandberg
Loading

This stack of pull requests is managed by Graphite. Learn more about stacking.

@sokra sokra mentioned this pull request Dec 6, 2024
Merged
@ijjk
Copy link
Member

ijjk commented Dec 6, 2024 •
edited
Loading

Failing test suites

Commit: d314313

pnpm test-dev-turbo test/development/app-dir/owner-stack-react-missing-key-prop/owner-stack-react-missing-key-prop.test.ts (turbopack)

  • app-dir - owner-stack-react-missing-key-prop > should catch invalid element from on rsc component
Expand output

● app-dir - owner-stack-react-missing-key-prop › should catch invalid element from on rsc component

expect(received).toMatchInlineSnapshot(snapshot)

Snapshot name: `app-dir - owner-stack-react-missing-key-prop should catch invalid element from on rsc component 1`

- Snapshot  - 1
+ Received  + 1

  at span ()
- at <anonymous> (app/rsc/page.tsx (7:9))
+ at app/rsc/page.tsx (7:9)
  at Array.map ()
  at Page (app/rsc/page.tsx (6:13))

  19 |
  20 |     if (isTurbopack) {
> 21 |       expect(stackFramesContent).toMatchInlineSnapshot(`
     |                                  ^
  22 |        "at span ()
  23 |        at <anonymous> (app/rsc/page.tsx (7:9))
  24 |        at Array.map ()

  at Object.toMatchInlineSnapshot (development/app-dir/owner-stack-react-missing-key-prop/owner-stack-react-missing-key-prop.test.ts:21:34)

Read more about building and testing Next.js in contributing.md.

pnpm test-start test/e2e/app-dir/server-source-maps/server-source-maps.test.ts

  • app-dir - server source maps > sourcemaps errors during module evaluation
Expand output

● app-dir - server source maps › sourcemaps errors during module evaluation

expect(received).toContain(expected) // indexOf

Expected substring: "
Error: module-evaluation

  at ../bundler:/app/module-evaluation/module.js:1:22
      at Object.<anonymous>"
  Received string:    "   ▲ Next.js 15.4.2-canary.31 (Turbopack)
     - Experiments (use with caution):
       · cpus: 1
       ✓ cacheComponents
       ✓ serverSourceMaps
       ✓ enablePrerenderSourceMaps (enabled by `experimental.cacheComponents`)·
     Creating an optimized production build ...
   ✓ Finished writing to disk in 4ms
   ✓ Compiled successfully in 1602ms
     Linting and checking validity of types ...
     Collecting page data ...
     Generating static pages (0/13) ...
  Error: bad-sourcemap
  at <mangled> (../.next/server/chunks/ssr/[root-of-the-server]__5980703f._.js:1:326)
      at stringify (<anonymous>)
  Error: module-evaluation
  at ../bundler:/app/module-evaluation/module.js:1:22
  at ../.next/server/app/module-evaluation/page.js:14:3
  > 1 | export const error = new Error('module-evaluation')
      |                      ^
    2 |
  Error: rsc-error-log-custom-name-Foo
  at <mangled> (../bundler:/app/rsc-error-log-custom-name/page.js:7:17)
      at stringify (<anonymous>)
     5 |
     6 | export default function Page() {
  >  7 |   console.error(new UnnamedError('rsc-error-log-custom-name-Foo'))
       |                 ^
     8 |   console.error(new NamedError('rsc-error-log-custom-name-Bar'))
     9 |   return null
    10 | }
  Error [MyError]: rsc-error-log-custom-name-Bar
  at <mangled> (../bundler:/app/rsc-error-log-custom-name/page.js:8:17)
      at stringify (<anonymous>)
     6 | export default function Page() {
     7 |   console.error(new UnnamedError('rsc-error-log-custom-name-Foo'))
  >  8 |   console.error(new NamedError('rsc-error-log-custom-name-Bar'))
       |                 ^
     9 |   return null
    10 | }
    11 |
  Error: rsc-error-log-cause
  at <mangled> (../bundler:/app/rsc-error-log-cause/page.js:2:17)
      at stringify (<anonymous>)
    1 | function logError(cause) {
  > 2 |   const error = new Error('rsc-error-log-cause', { cause })
      |                 ^
    3 |   console.error(error)
    4 | }
    5 | {
    [cause]: Error: Boom
  at <mangled> (../bundler:/app/rsc-error-log-cause/page.js:7:17)
        at stringify (<anonymous>)
       5 |
       6 | export default function Page() {
    >  7 |   const error = new Error('Boom')
         |                 ^
       8 |   logError(error)
       9 |   return null
      10 | }
  }
  Error: bad-sourcemap
  at <mangled> (../.next/server/chunks/ssr/[root-of-the-server]__5980703f._.js:1:326)
      at stringify (<anonymous>)
  Error: module-evaluation
  at ../bundler:/app/module-evaluation/module.js:1:22
  at ../.next/server/app/module-evaluation/page.js:14:3
  > 1 | export const error = new Error('module-evaluation')
      |                      ^
    2 |
  Error: rsc-error-log-custom-name-Foo
  at <mangled> (../bundler:/app/rsc-error-log-custom-name/page.js:7:17)
      at stringify (<anonymous>)
     5 |
     6 | export default function Page() {
  >  7 |   console.error(new UnnamedError('rsc-error-log-custom-name-Foo'))
       |                 ^
     8 |   console.error(new NamedError('rsc-error-log-custom-name-Bar'))
     9 |   return null
    10 | }
  Error [MyError]: rsc-error-log-custom-name-Bar
  at <mangled> (../bundler:/app/rsc-error-log-custom-name/page.js:8:17)
      at stringify (<anonymous>)
     6 | export default function Page() {
     7 |   console.error(new UnnamedError('rsc-error-log-custom-name-Foo'))
  >  8 |   console.error(new NamedError('rsc-error-log-custom-name-Bar'))
       |                 ^
     9 |   return null
    10 | }
    11 |
  Error: rsc-error-log-cause
  at <mangled> (../bundler:/app/rsc-error-log-cause/page.js:2:17)
      at stringify (<anonymous>)
    1 | function logError(cause) {
  > 2 |   const error = new Error('rsc-error-log-cause', { cause })
      |                 ^
    3 |   console.error(error)
    4 | }
    5 | {
    [cause]: Error: Boom
  at <mangled> (../bundler:/app/rsc-error-log-cause/page.js:7:17)
        at stringify (<anonymous>)
       5 |
       6 | export default function Page() {
    >  7 |   const error = new Error('Boom')
         |                 ^
       8 |   logError(error)
       9 |   return null
      10 | }
  }
  Error: rsc-anonymous-stack-frame-sandwich: external
      at stringify (<anonymous>)
  Error: rsc-anonymous-stack-frame-sandwich: internal
      at stringify (<anonymous>)
  Error: rsc-anonymous-stack-frame-sandwich: external
      at stringify (<anonymous>)
  Error: rsc-anonymous-stack-frame-sandwich: internal
      at stringify (<anonymous>)
     Generating static pages (3/13)··
     Generating static pages (6/13)··
  Error: rsc-error-log
  at <mangled> (../bundler:/app/rsc-error-log/page.js:4:17)
      at stringify (<anonymous>)
    2 |
    3 | function logError() {
  > 4 |   const error = new Error('rsc-error-log')
      |                 ^
    5 |   console.error(error)
    6 | }
    7 |
  Error: ssr-anonymous-stack-frame-sandwich: external
  at <mangled> (../bundler:/app/ssr-anonymous-stack-frame-sandwich/page.js:6:3)
    4 |
    5 | export default function Page() {
  > 6 |   runHiddenSetOfSetsExternal('ssr-anonymous-stack-frame-sandwich: external')
      |   ^
    7 |   runHiddenSetOfSetsInternal('ssr-anonymous-stack-frame-sandwich: internal')
    8 |
    9 |   return null
  Error: ignore-listed frames
  at <unknown> (../.next/server/chunks/ssr/[root-of-the-server]__68c01fce._.js:1:220)
  at <unknown> (../.next/server/chunks/ssr/[root-of-the-server]__68c01fce._.js:1:281)
      at Set.forEach (<anonymous>)
  at <unknown> (../.next/server/chunks/ssr/[root-of-the-server]__68c01fce._.js:1:269)
      at Set.forEach (<anonymous>)
  at <mangled> (../.next/server/chunks/ssr/[root-of-the-server]__68c01fce._.js:1:255)
  at <mangled> (../bundler:/app/ssr-anonymous-stack-frame-sandwich/page.js:7:3)
     5 | export default function Page() {
     6 |   runHiddenSetOfSetsExternal('ssr-anonymous-stack-frame-sandwich: external')
  >  7 |   runHiddenSetOfSetsInternal('ssr-anonymous-stack-frame-sandwich: internal')
       |   ^
     8 |
     9 |   return null
    10 | }
  Error: ssr-error-log-ignore-listed
  at <unknown> (../bundler:/app/ssr-error-log-ignore-listed/page.js:9:17)
  at <mangled> (../.next/server/chunks/ssr/[root-of-the-server]__4d8a45e7._.js:1:569)
  at <unknown> (../bundler:/app/ssr-error-log-ignore-listed/page.js:18:11)
  at <unknown> (../bundler:/app/ssr-error-log-ignore-listed/page.js:17:9)
  at <unknown> (../bundler:/app/ssr-error-log-ignore-listed/page.js:16:7)
  at <mangled> (../.next/server/chunks/ssr/[root-of-the-server]__68c01fce._.js:1:167)
  at <unknown> (../bundler:/app/ssr-error-log-ignore-listed/page.js:15:5)
  at <mangled> (../bundler:/internal-pkg/index.js:2:10)
  at <mangled> (../bundler:/app/ssr-error-log-ignore-listed/page.js:14:3)
     7 |
     8 | function logError() {
  >  9 |   const error = new Error('ssr-error-log-ignore-listed')
       |                 ^
    10 |   console.error(error)
    11 | }
    12 |
  Error: rsc-error-log-ignore-listed
  at <unknown> (../bundler:/app/rsc-error-log-ignore-listed/page.js:8:17)
  at <unknown> (../bundler:/app/rsc-error-log-ignore-listed/page.js:17:11)
  at <unknown> (../bundler:/app/rsc-error-log-ignore-listed/page.js:16:9)
  at <unknown> (../bundler:/app/rsc-error-log-ignore-listed/page.js:15:7)
  at <mangled> (../.next/server/chunks/ssr/[root-of-the-server]__ef633d42._.js:1:757)
  at <unknown> (../bundler:/app/rsc-error-log-ignore-listed/page.js:14:5)
  at <mangled> (../bundler:/internal-pkg/index.js:2:10)
  at <mangled> (../bundler:/app/rsc-error-log-ignore-listed/page.js:13:3)
      at stringify (<anonymous>)
     6 |
     7 | function logError() {
  >  8 |   const error = new Error('rsc-error-log-ignore-listed')
       |                 ^
     9 |   console.error(error)
    10 | }
    11 |
  Error: rsc-error-log
  at <mangled> (../bundler:/app/rsc-error-log/page.js:4:17)
      at stringify (<anonymous>)
    2 |
    3 | function logError() {
  > 4 |   const error = new Error('rsc-error-log')
      |                 ^
    5 |   console.error(error)
    6 | }
    7 |
  Error: ssr-anonymous-stack-frame-sandwich: external
  at <mangled> (../bundler:/app/ssr-anonymous-stack-frame-sandwich/page.js:6:3)
    4 |
    5 | export default function Page() {
  > 6 |   runHiddenSetOfSetsExternal('ssr-anonymous-stack-frame-sandwich: external')
      |   ^
    7 |   runHiddenSetOfSetsInternal('ssr-anonymous-stack-frame-sandwich: internal')
    8 |
    9 |   return null
  Error: ignore-listed frames
  at <unknown> (../.next/server/chunks/ssr/[root-of-the-server]__68c01fce._.js:1:220)
  at <unknown> (../.next/server/chunks/ssr/[root-of-the-server]__68c01fce._.js:1:281)
      at Set.forEach (<anonymous>)
  at <unknown> (../.next/server/chunks/ssr/[root-of-the-server]__68c01fce._.js:1:269)
      at Set.forEach (<anonymous>)
  at <mangled> (../.next/server/chunks/ssr/[root-of-the-server]__68c01fce._.js:1:255)
  at <mangled> (../bundler:/app/ssr-anonymous-stack-frame-sandwich/page.js:7:3)
     5 | export default function Page() {
     6 |   runHiddenSetOfSetsExternal('ssr-anonymous-stack-frame-sandwich: external')
  >  7 |   runHiddenSetOfSetsInternal('ssr-anonymous-stack-frame-sandwich: internal')
       |   ^
     8 |
     9 |   return null
    10 | }
  Error: ssr-error-log-ignore-listed
  at <unknown> (../bundler:/app/ssr-error-log-ignore-listed/page.js:9:17)
  at <mangled> (../.next/server/chunks/ssr/[root-of-the-server]__4d8a45e7._.js:1:569)
  at <unknown> (../bundler:/app/ssr-error-log-ignore-listed/page.js:18:11)
  at <unknown> (../bundler:/app/ssr-error-log-ignore-listed/page.js:17:9)
  at <unknown> (../bundler:/app/ssr-error-log-ignore-listed/page.js:16:7)
  at <mangled> (../.next/server/chunks/ssr/[root-of-the-server]__68c01fce._.js:1:167)
  at <unknown> (../bundler:/app/ssr-error-log-ignore-listed/page.js:15:5)
  at <mangled> (../bundler:/internal-pkg/index.js:2:10)
  at <mangled> (../bundler:/app/ssr-error-log-ignore-listed/page.js:14:3)
     7 |
     8 | function logError() {
  >  9 |   const error = new Error('ssr-error-log-ignore-listed')
       |                 ^
    10 |   console.error(error)
    11 | }
    12 |
  Error: rsc-error-log-ignore-listed
  at <unknown> (../bundler:/app/rsc-error-log-ignore-listed/page.js:8:17)
  at <unknown> (../bundler:/app/rsc-error-log-ignore-listed/page.js:17:11)
  at <unknown> (../bundler:/app/rsc-error-log-ignore-listed/page.js:16:9)
  at <unknown> (../bundler:/app/rsc-error-log-ignore-listed/page.js:15:7)
  at <mangled> (../.next/server/chunks/ssr/[root-of-the-server]__ef633d42._.js:1:757)
  at <unknown> (../bundler:/app/rsc-error-log-ignore-listed/page.js:14:5)
  at <mangled> (../bundler:/internal-pkg/index.js:2:10)
  at <mangled> (../bundler:/app/rsc-error-log-ignore-listed/page.js:13:3)
      at stringify (<anonymous>)
     6 |
     7 | function logError() {
  >  8 |   const error = new Error('rsc-error-log-ignore-listed')
       |                 ^
     9 |   console.error(error)
    10 | }
    11 |
     Generating static pages (9/13)··
   ✓ Generating static pages (13/13)
     Finalizing page optimization ...
     Collecting build traces ...·
  Route (app)                                 Size  First Load JS
  ┌ ○ /_not-found                              0 B         125 kB
  ├ ○ /bad-sourcemap                           0 B         125 kB
  ├ ○ /module-evaluation                       0 B         125 kB
  ├ ○ /rsc-anonymous-stack-frame-sandwich      0 B         125 kB
  ├ ○ /rsc-error-log                           0 B         125 kB
  ├ ○ /rsc-error-log-cause                     0 B         125 kB
  ├ ○ /rsc-error-log-custom-name               0 B         125 kB
  ├ ○ /rsc-error-log-ignore-listed             0 B         125 kB
  ├ ◐ /ssr-anonymous-stack-frame-sandwich    417 B         125 kB
  ├ ◐ /ssr-error-log-ignore-listed           408 B         125 kB
  └ ◐ /ssr-throw                             222 B         125 kB
  + First Load JS shared by all             125 kB
    ├ chunks/775ba22e7b281603.js           87.4 kB
    ├ chunks/d56f904112cb2fd8.js           23.8 kB
    └ other shared chunks (total)          13.6 kB··
  ○  (Static)             prerendered as static content
  ◐  (Partial Prerender)  prerendered as static HTML with dynamic server-streamed content·
     ▲ Next.js 15.4.2-canary.31
     - Local:        http://localhost:33045
     - Network:      http://65.21.220.144:33045·
   ✓ Starting...
   ✓ Ready in 184ms
  "
  at Object.toContain (e2e/app-dir/server-source-maps/server-source-maps.test.ts:514:52)

Read more about building and testing Next.js in contributing.md.

pnpm test-dev-turbo test/e2e/app-dir/cache-components-allow-otel-spans/cache-components-allow-otel-spans.test.ts (turbopack)

  • hello-world > should allow creating spans during cache component validation without triggering sync IO bailouts - inside a Cache Component - without prerendering the page
  • hello-world > should allow creating spans during cache component validation without triggering sync IO bailouts - inside a Cache Component - with prerendering the page
  • hello-world > should allow creating spans during cache component validation without triggering sync IO bailouts - inside a Server Component - without prerendering the page
  • hello-world > should allow creating spans during cache component validation without triggering sync IO bailouts - inside a Server Component - with prerendering the page
Expand output

● hello-world › should allow creating spans during cache component validation without triggering sync IO bailouts - inside a Cache Component - without prerendering the page

expect(received).toMatchInlineSnapshot(snapshot)

Snapshot name: `hello-world should allow creating spans during cache component validation without triggering sync IO bailouts - inside a Cache Component - without prerendering the page 1`

- Snapshot  - 2
+ Received  + 2

  {
    "description": "A Cache Function (`use cache`) was passed to startActiveSpan which means it will receive a Span argument with a possibly random ID on every invocation leading to cache misses. Provide a wrapping function around the Cache Function that does not forward the Span argument to avoid this issue.",
    "environmentLabel": "Cache",
    "label": "Console Error",
-   "source": "app/traced-work.tsx (26:19) @ <anonymous>
+   "source": "app/traced-work.tsx (26:19)
  > 26 |     return tracer.startActiveSpan('span-active-span', fn)
       |                   ^",
    "stack": [
-     "<anonymous> app/traced-work.tsx (26:19)",
+     "app/traced-work.tsx (26:19)",
      "Inner app/traced-work.tsx (97:26)",
      "Page <anonymous>",
    ],
  }

  11 |       const browser = await next.browser('/novel/cache')
  12 |       if (isTurbopack) {
> 13 |         await expect(browser).toDisplayCollapsedRedbox(`
     |                               ^
  14 |          {
  15 |            "description": "A Cache Function (\`use cache\`) was passed to startActiveSpan which means it will receive a Span argument with a possibly random ID on every invocation leading to cache misses. Provide a wrapping function around the Cache Function that does not forward the Span argument to avoid this issue.",
  16 |            "environmentLabel": "Cache",

  at Object.toDisplayCollapsedRedbox (e2e/app-dir/cache-components-allow-otel-spans/cache-components-allow-otel-spans.test.ts:13:31)

● hello-world › should allow creating spans during cache component validation without triggering sync IO bailouts - inside a Cache Component - with prerendering the page

expect(received).toMatchInlineSnapshot(snapshot)

Snapshot name: `hello-world should allow creating spans during cache component validation without triggering sync IO bailouts - inside a Cache Component - with prerendering the page 1`

- Snapshot  - 2
+ Received  + 2

  {
    "description": "A Cache Function (`use cache`) was passed to startActiveSpan which means it will receive a Span argument with a possibly random ID on every invocation leading to cache misses. Provide a wrapping function around the Cache Function that does not forward the Span argument to avoid this issue.",
    "environmentLabel": "Cache",
    "label": "Console Error",
-   "source": "app/traced-work.tsx (26:19) @ <anonymous>
+   "source": "app/traced-work.tsx (26:19)
  > 26 |     return tracer.startActiveSpan('span-active-span', fn)
       |                   ^",
    "stack": [
-     "<anonymous> app/traced-work.tsx (26:19)",
+     "app/traced-work.tsx (26:19)",
      "Inner app/traced-work.tsx (97:26)",
      "Page <anonymous>",
    ],
  }

  59 |       const browser = await next.browser('/prerendered/cache')
  60 |       if (isTurbopack) {
> 61 |         await expect(browser).toDisplayCollapsedRedbox(`
     |                               ^
  62 |          {
  63 |            "description": "A Cache Function (\`use cache\`) was passed to startActiveSpan which means it will receive a Span argument with a possibly random ID on every invocation leading to cache misses. Provide a wrapping function around the Cache Function that does not forward the Span argument to avoid this issue.",
  64 |            "environmentLabel": "Cache",

  at Object.toDisplayCollapsedRedbox (e2e/app-dir/cache-components-allow-otel-spans/cache-components-allow-otel-spans.test.ts:61:31)

● hello-world › should allow creating spans during cache component validation without triggering sync IO bailouts - inside a Server Component - without prerendering the page

expect(received).toMatchInlineSnapshot(snapshot)

Snapshot name: `hello-world should allow creating spans during cache component validation without triggering sync IO bailouts - inside a Server Component - without prerendering the page 1`

- Snapshot  - 2
+ Received  + 2

  {
    "description": "A Cache Function (`use cache`) was passed to startActiveSpan which means it will receive a Span argument with a possibly random ID on every invocation leading to cache misses. Provide a wrapping function around the Cache Function that does not forward the Span argument to avoid this issue.",
    "environmentLabel": "Prerender",
    "label": "Console Error",
-   "source": "app/traced-work.tsx (26:19) @ <anonymous>
+   "source": "app/traced-work.tsx (26:19)
  > 26 |     return tracer.startActiveSpan('span-active-span', fn)
       |                   ^",
    "stack": [
-     "<anonymous> app/traced-work.tsx (26:19)",
+     "app/traced-work.tsx (26:19)",
      "Inner app/traced-work.tsx (97:26)",
      "CachedInnerTraceActiveSpan app/traced-work.tsx (104:9)",
      "Page app/[slug]/server/page.tsx (29:7)",
    ],
  }

  106 |       const browser = await next.browser('/novel/server')
  107 |       if (isTurbopack) {
> 108 |         await expect(browser).toDisplayCollapsedRedbox(`
      |                               ^
  109 |          {
  110 |            "description": "A Cache Function (\`use cache\`) was passed to startActiveSpan which means it will receive a Span argument with a possibly random ID on every invocation leading to cache misses. Provide a wrapping function around the Cache Function that does not forward the Span argument to avoid this issue.",
  111 |            "environmentLabel": "Prerender",

  at Object.toDisplayCollapsedRedbox (e2e/app-dir/cache-components-allow-otel-spans/cache-components-allow-otel-spans.test.ts:108:31)

● hello-world › should allow creating spans during cache component validation without triggering sync IO bailouts - inside a Server Component - with prerendering the page

expect(received).toMatchInlineSnapshot(snapshot)

Snapshot name: `hello-world should allow creating spans during cache component validation without triggering sync IO bailouts - inside a Server Component - with prerendering the page 1`

- Snapshot  - 2
+ Received  + 2

  {
    "description": "A Cache Function (`use cache`) was passed to startActiveSpan which means it will receive a Span argument with a possibly random ID on every invocation leading to cache misses. Provide a wrapping function around the Cache Function that does not forward the Span argument to avoid this issue.",
    "environmentLabel": "Prerender",
    "label": "Console Error",
-   "source": "app/traced-work.tsx (26:19) @ <anonymous>
+   "source": "app/traced-work.tsx (26:19)
  > 26 |     return tracer.startActiveSpan('span-active-span', fn)
       |                   ^",
    "stack": [
-     "<anonymous> app/traced-work.tsx (26:19)",
+     "app/traced-work.tsx (26:19)",
      "Inner app/traced-work.tsx (97:26)",
      "CachedInnerTraceActiveSpan app/traced-work.tsx (104:9)",
      "Page app/[slug]/server/page.tsx (29:7)",
    ],
  }

  156 |       const browser = await next.browser('/prerendered/server')
  157 |       if (isTurbopack) {
> 158 |         await expect(browser).toDisplayCollapsedRedbox(`
      |                               ^
  159 |          {
  160 |            "description": "A Cache Function (\`use cache\`) was passed to startActiveSpan which means it will receive a Span argument with a possibly random ID on every invocation leading to cache misses. Provide a wrapping function around the Cache Function that does not forward the Span argument to avoid this issue.",
  161 |            "environmentLabel": "Prerender",

  at Object.toDisplayCollapsedRedbox (e2e/app-dir/cache-components-allow-otel-spans/cache-components-allow-otel-spans.test.ts:158:31)

Read more about building and testing Next.js in contributing.md.

pnpm test-dev test/development/acceptance-app/ReactRefreshLogBox.test.ts

  • ReactRefreshLogBox app > should hide unrelated frames in stack trace with unknown anonymous calls
Expand output

● ReactRefreshLogBox app › should hide unrelated frames in stack trace with unknown anonymous calls

expect(received).toMatchInlineSnapshot(snapshot)

Snapshot name: `ReactRefreshLogBox app should hide unrelated frames in stack trace with unknown anonymous calls 1`

- Snapshot  - 1
+ Received  + 1

@@ -4,9 +4,9 @@
    "label": "Runtime Error",
    "source": "app/page.js (4:13)
  > 4 |       throw new Error("This is an error from an anonymous function");
      |             ^",
    "stack": [
-     "eval app/page.js (4:13)",
+     "app/page.js (4:13)",
      "Page app/page.js (5:5)",
    ],
  }

  1161 |     // TODO(veil): Turbopack uses correct name
  1162 |     // TODO(veil): Column of 2nd frame should be 7
> 1163 |     await expect(browser).toDisplayRedbox(`
       |                           ^
  1164 |       {
  1165 |         "description": "This is an error from an anonymous function",
  1166 |         "environmentLabel": "Server",

  at Object.toDisplayRedbox (development/acceptance-app/ReactRefreshLogBox.test.ts:1163:27)

Read more about building and testing Next.js in contributing.md.

__NEXT_EXPERIMENTAL_PPR=true pnpm test-dev test/e2e/app-dir/dynamic-data/dynamic-data.test.ts (PPR)

  • dynamic-data inside cache scope > displays redbox when accessing dynamic data inside a cache scope
Expand output

● dynamic-data inside cache scope › displays redbox when accessing dynamic data inside a cache scope

expect(received).toMatchInlineSnapshot(snapshot)

Snapshot name: `dynamic-data inside cache scope displays redbox when accessing dynamic data inside a cache scope 1`

- Snapshot  - 2
+ Received  + 2

  {
    "description": "Route /cookies used "cookies" inside a function cached with "unstable_cache(...)". Accessing Dynamic data sources inside a cache scope is not supported. If you need this data inside a cached function use "cookies" outside of the cached function and pass the required dynamic data in as an argument. See more info here: https://nextjs.org/docs/app/api-reference/functions/unstable_cache",
    "environmentLabel": "Server",
    "label": "Runtime Error",
-   "source": "app/cookies/page.js (4:40) @ eval
+   "source": "app/cookies/page.js (4:40)
  > 4 | const cookies = cache(() => nextCookies())
      |                                        ^",
    "stack": [
-     "eval app/cookies/page.js (4:40)",
+     "app/cookies/page.js (4:40)",
      "Page app/cookies/page.js (15:11)",
    ],
  }

  306 |       let browser = await next.browser('/cookies')
  307 |       try {
> 308 |         await expect(browser).toDisplayRedbox(`
      |                               ^
  309 |          {
  310 |            "description": "Route /cookies used "cookies" inside a function cached with "unstable_cache(...)". Accessing Dynamic data sources inside a cache scope is not supported. If you need this data inside a cached function use "cookies" outside of the cached function and pass the required dynamic data in as an argument. See more info here: https://nextjs.org/docs/app/api-reference/functions/unstable_cache",
  311 |            "environmentLabel": "Server",

  at Object.toDisplayRedbox (e2e/app-dir/dynamic-data/dynamic-data.test.ts:308:31)

Read more about building and testing Next.js in contributing.md.

pnpm test-dev-turbo test/development/middleware-errors/index.test.ts (turbopack)

  • middleware - development errors > when throwing while loading the module > logs the error correctly
Expand output

● middleware - development errors › when throwing while loading the module › logs the error correctly

expect(received).toContain(expected) // indexOf

Expected substring: "
 ⨯ Error: booooom!

  at ../middleware.js:3:12"
  Received string:    "   ▲ Next.js 15.4.2-canary.31 (Turbopack)
     - Local:        http://localhost:35559
     - Network:      http://136.243.37.172:35559·
   ✓ Starting...
  Creating turbopack project {
    dir: '/tmp/next-install-6aff4d9772be158249298524557574cd12d0a9f45f0c061581c1c3b90a36b305',
    testMode: true
  }
   ✓ Compiled middleware in 111ms
   ✓ Ready in 633ms
   ⨯ Error: booooom!
  at ../middleware.js:3:13
    1 |
    2 |       import { NextResponse } from 'next/server'
  > 3 |       throw new Error('booooom!')
      |             ^
    4 |       export default function () {
    5 |         return NextResponse.next()
    6 |       }
   ○ Compiling /_error ...
   ✓ Compiled /_error in 991ms
  "
  at Object.toContain (development/middleware-errors/index.test.ts:266:41)

Read more about building and testing Next.js in contributing.md.

pnpm test-start-turbo test/e2e/app-dir/cache-components-errors/cache-components-errors.test.ts (turbopack)

  • Cache Components Errors > Build With --prerender-debug > With use cache: private > in unstable_cache > should error the build
  • Cache Components Errors > Build With --prerender-debug > With use cache: private > in use cache > should error the build
  • Cache Components Errors > Build Without --prerender-debug > With use cache: private > in unstable_cache > should error the build
  • Cache Components Errors > Build Without --prerender-debug > With use cache: private > in use cache > should error the build
Expand output

● Cache Components Errors › Build With --prerender-debug › With use cache: private › in unstable_cache › should error the build

expect(received).toMatchInlineSnapshot(snapshot)

Snapshot name: `Cache Components Errors Build With --prerender-debug With \`use cache: private\` in \`unstable_cache\` should error the build 1`

- Snapshot  - 2
+ Received  + 2

@@ -1,9 +1,9 @@
  "Error: "use cache: private" must not be used within `unstable_cache()`.

  at ../bundler:/app/use-cache-private-in-unstable-cache/page.tsx:21:38
  -     at a (<next-dist-dir>)
  -     at b (<next-dist-dir>)
  +     at .next/server/chunks/ssr/[root-of-the-server]__4ad44e19._.js:111:68
  +     at .next/server/app/use-cache-private-in-unstable-cache/page.js:19:3
      19 | }
      20 |
    > 21 | const getCachedData = unstable_cache(async () => {
         |                                      ^
      22 |   'use cache: private'
  at Object.toMatchInlineSnapshot (e2e/app-dir/cache-components-errors/cache-components-errors.test.ts:2487:32)

● Cache Components Errors › Build With --prerender-debug › With use cache: private › in use cache › should error the build

expect(received).toMatchInlineSnapshot(snapshot)

Snapshot name: `Cache Components Errors Build With --prerender-debug With \`use cache: private\` in \`use cache\` should error the build 1`

- Snapshot  - 4
+ Received  + 4

@@ -1,20 +1,20 @@
  "Error: "use cache: private" must not be used within "use cache". It can only be nested inside of another "use cache: private".

  at ../bundler:/app/use-cache-private-in-use-cache/page.tsx:15:1
  -     at a (<next-dist-dir>)
  -     at b (<next-dist-dir>)
  +     at .next/server/chunks/ssr/[root-of-the-server]__0206ff50._.js:158:68
  +     at .next/server/app/use-cache-private-in-use-cache/page.js:18:3
      13 | }
      14 |
    > 15 | async function Private() {
         | ^
      16 |   'use cache: private'
      17 |
      18 |   return <p>Private</p>
    Error: "use cache: private" must not be used within "use cache". It can only be nested inside of another "use cache: private".
  at ../bundler:/app/use-cache-private-in-use-cache/page.tsx:15:1
  -     at c (<next-dist-dir>)
  -     at d (<next-dist-dir>)
  +     at .next/server/chunks/ssr/[root-of-the-server]__0206ff50._.js:158:68
  +     at .next/server/app/use-cache-private-in-use-cache/page.js:18:3
      13 | }
      14 |
    > 15 | async function Private() {
         | ^
      16 |   'use cache: private'
  at Object.toMatchInlineSnapshot (e2e/app-dir/cache-components-errors/cache-components-errors.test.ts:2632:32)

● Cache Components Errors › Build Without --prerender-debug › With use cache: private › in unstable_cache › should error the build

expect(received).toMatchInlineSnapshot(snapshot)

Snapshot name: `Cache Components Errors Build Without --prerender-debug With \`use cache: private\` in \`unstable_cache\` should error the build 1`

- Snapshot  - 1
+ Received  + 1

@@ -1,8 +1,8 @@
  "Error: "use cache: private" must not be used within `unstable_cache()`.

  at ../bundler:/app/use-cache-private-in-unstable-cache/page.tsx:21:38
  -     at a (<next-dist-dir>)
  +     at .next/server/app/use-cache-private-in-unstable-cache/page.js:19:3
      19 | }
      20 |
    > 21 | const getCachedData = unstable_cache(async () => {
         |                                      ^
      22 |   'use cache: private'
  at Object.toMatchInlineSnapshot (e2e/app-dir/cache-components-errors/cache-components-errors.test.ts:2506:32)

● Cache Components Errors › Build Without --prerender-debug › With use cache: private › in use cache › should error the build

expect(received).toMatchInlineSnapshot(snapshot)

Snapshot name: `Cache Components Errors Build Without --prerender-debug With \`use cache: private\` in \`use cache\` should error the build 1`

- Snapshot  - 2
+ Received  + 2

@@ -1,20 +1,20 @@
  "Error: "use cache: private" must not be used within "use cache". It can only be nested inside of another "use cache: private".

  at ../bundler:/app/use-cache-private-in-use-cache/page.tsx:15:1
  at ../bundler:/app/use-cache-private-in-use-cache/page.tsx:15:16
  -     at a (<next-dist-dir>)
  +     at .next/server/app/use-cache-private-in-use-cache/page.js:18:3
      13 | }
      14 |
    > 15 | async function Private() {
         | ^
      16 |   'use cache: private'
      17 |
      18 |   return <p>Private</p>
    Error: "use cache: private" must not be used within "use cache". It can only be nested inside of another "use cache: private".
  at ../bundler:/app/use-cache-private-in-use-cache/page.tsx:15:1
  at ../bundler:/app/use-cache-private-in-use-cache/page.tsx:15:16
  -     at b (<next-dist-dir>)
  +     at .next/server/app/use-cache-private-in-use-cache/page.js:18:3
      13 | }
      14 |
    > 15 | async function Private() {
         | ^
      16 |   'use cache: private'
  at Object.toMatchInlineSnapshot (e2e/app-dir/cache-components-errors/cache-components-errors.test.ts:2662:32)

Read more about building and testing Next.js in contributing.md.

@ijjk
Copy link
Member

ijjk commented Dec 6, 2024 •
edited
Loading

Stats from current PR

Default Build (Increase detected ⚠️)
General Overall increase ⚠️
vercel/next.js canary vercel/next.js sokra/hide-method-names Change
buildDuration 24.4s 17.5s N/A
buildDurationCached 16.8s 15s N/A
nodeModulesSize 446 MB 446 MB ⚠️ +14.1 kB
nextStartRea..uration (ms) 429ms 443ms N/A
Client Bundles (main, webpack)
vercel/next.js canary vercel/next.js sokra/hide-method-names Change
2256-HASH.js gzip 45.8 kB 45.2 kB N/A
234bef07-HASH.js gzip 54.1 kB 54.1 kB N/A
5194.HASH.js gzip 169 B 169 B ✓
8863-HASH.js gzip 5.27 kB 5.27 kB N/A
framework-HASH.js gzip 57.7 kB 57.7 kB N/A
main-app-HASH.js gzip 255 B 254 B N/A
main-HASH.js gzip 36.6 kB 36.4 kB N/A
webpack-HASH.js gzip 1.71 kB 1.71 kB N/A
Overall change 169 B 169 B ✓
Legacy Client Bundles (polyfills)
vercel/next.js canary vercel/next.js sokra/hide-method-names Change
polyfills-HASH.js gzip 39.4 kB 39.4 kB ✓
Overall change 39.4 kB 39.4 kB ✓
Client Pages
vercel/next.js canary vercel/next.js sokra/hide-method-names Change
_app-HASH.js gzip 194 B 193 B N/A
_error-HASH.js gzip 182 B 182 B ✓
amp-HASH.js gzip 502 B 507 B N/A
css-HASH.js gzip 335 B 333 B N/A
dynamic-HASH.js gzip 1.83 kB 1.83 kB N/A
edge-ssr-HASH.js gzip 255 B 255 B ✓
head-HASH.js gzip 350 B 352 B N/A
hooks-HASH.js gzip 385 B 383 B N/A
image-HASH.js gzip 4.65 kB 4.66 kB N/A
index-HASH.js gzip 257 B 259 B N/A
link-HASH.js gzip 2.52 kB 2.52 kB N/A
routerDirect..HASH.js gzip 320 B 318 B N/A
script-HASH.js gzip 387 B 386 B N/A
withRouter-HASH.js gzip 315 B 313 B N/A
1afbb74e6ecf..834.css gzip 106 B 106 B ✓
Overall change 543 B 543 B ✓
Client Build Manifests
vercel/next.js canary vercel/next.js sokra/hide-method-names Change
_buildManifest.js gzip 753 B 751 B N/A
Overall change 0 B 0 B ✓
Rendered Page Sizes
vercel/next.js canary vercel/next.js sokra/hide-method-names Change
index.html gzip 525 B 523 B N/A
link.html gzip 539 B 538 B N/A
withRouter.html gzip 521 B 519 B N/A
Overall change 0 B 0 B ✓
Edge SSR bundle Size
vercel/next.js canary vercel/next.js sokra/hide-method-names Change
edge-ssr.js gzip 120 kB 120 kB N/A
page.js gzip 223 kB 223 kB N/A
Overall change 0 B 0 B ✓
Middleware size Overall increase ⚠️
vercel/next.js canary vercel/next.js sokra/hide-method-names Change
middleware-b..fest.js gzip 674 B 674 B ✓
middleware-r..fest.js gzip 156 B 155 B N/A
middleware.js gzip 32.2 kB 32.5 kB ⚠️ +256 B
edge-runtime..pack.js gzip 853 B 853 B ✓
Overall change 33.7 kB 34 kB ⚠️ +256 B
Next Runtimes
vercel/next.js canary vercel/next.js sokra/hide-method-names Change
app-page-exp...dev.js gzip 283 kB 283 kB ✓
app-page-exp..prod.js gzip 156 kB 156 kB ✓
app-page-tur...dev.js gzip 283 kB 283 kB N/A
app-page-tur..prod.js gzip 156 kB 156 kB ✓
app-page-tur...dev.js gzip 271 kB 271 kB ✓
app-page-tur..prod.js gzip 150 kB 150 kB ✓
app-page.run...dev.js gzip 271 kB 271 kB N/A
app-page.run..prod.js gzip 150 kB 150 kB ✓
app-route-ex...dev.js gzip 69.2 kB 69.2 kB ✓
app-route-ex..prod.js gzip 48.7 kB 48.7 kB ✓
app-route-tu...dev.js gzip 69.2 kB 69.2 kB ✓
app-route-tu..prod.js gzip 48.7 kB 48.7 kB ✓
app-route-tu...dev.js gzip 68.6 kB 68.6 kB ✓
app-route-tu..prod.js gzip 48.3 kB 48.3 kB ✓
app-route.ru...dev.js gzip 68.5 kB 68.5 kB ✓
app-route.ru..prod.js gzip 48.3 kB 48.3 kB ✓
dist_client_...dev.js gzip 326 B 326 B ✓
dist_client_...dev.js gzip 328 B 328 B ✓
dist_client_...dev.js gzip 320 B 320 B ✓
dist_client_...dev.js gzip 318 B 318 B ✓
pages-api-tu...dev.js gzip 42.3 kB 42.3 kB ✓
pages-api-tu..prod.js gzip 32.5 kB 32.5 kB ✓
pages-api.ru...dev.js gzip 42.3 kB 42.3 kB ✓
pages-api.ru..prod.js gzip 32.5 kB 32.5 kB ✓
pages-turbo....dev.js gzip 52.3 kB 52.3 kB ✓
pages-turbo...prod.js gzip 39.9 kB 39.9 kB ✓
pages.runtim...dev.js gzip 52.5 kB 52.5 kB ✓
pages.runtim..prod.js gzip 40 kB 40 kB ✓
server.runti..prod.js gzip 59.6 kB 59.7 kB N/A
Overall change 1.97 MB 1.97 MB ✓
build cache Overall increase ⚠️
vercel/next.js canary vercel/next.js sokra/hide-method-names Change
0.pack gzip 2.85 MB 2.85 MB ⚠️ +683 B
index.pack gzip 93.1 kB 92.7 kB N/A
Overall change 2.85 MB 2.85 MB ⚠️ +683 B
Diff details
Diff for page.js

Diff too large to display

Diff for middleware.js

Diff too large to display

Diff for edge-ssr.js 
failed to diff
Diff for amp-HASH.js 
@@ -1,17 +1,65 @@
 (self["webpackChunk_N_E"] = self["webpackChunk_N_E"] || []).push([
   [5034],
   {
-    /***/ 4105: /***/ (
+    /***/ 6212: /***/ (
+      __unused_webpack_module,
+      __webpack_exports__,
+      __webpack_require__
+    ) => {
+      "use strict";
+      __webpack_require__.r(__webpack_exports__);
+      /* harmony export */ __webpack_require__.d(__webpack_exports__, {
+        /* harmony export */ config: () => /* binding */ config,
+        /* harmony export */ default: () => /* binding */ Amp,
+        /* harmony export */
+      });
+      /* harmony import */ var next_amp__WEBPACK_IMPORTED_MODULE_0__ =
+        __webpack_require__(7023);
+      /* harmony import */ var next_amp__WEBPACK_IMPORTED_MODULE_0___default =
+        /*#__PURE__*/ __webpack_require__.n(
+          next_amp__WEBPACK_IMPORTED_MODULE_0__
+        );
+
+      const config = {
+        amp: "hybrid",
+      };
+      function Amp(props) {
+        return (0, next_amp__WEBPACK_IMPORTED_MODULE_0__.useAmp)()
+          ? "AMP mode"
+          : "normal mode";
+      }
+
+      /***/
+    },
+
+    /***/ 7023: /***/ (
       module,
       __unused_webpack_exports,
       __webpack_require__
     ) => {
-      module.exports = __webpack_require__(4642);
+      module.exports = __webpack_require__(9926);
+
+      /***/
+    },
+
+    /***/ 8647: /***/ (
+      __unused_webpack_module,
+      __unused_webpack_exports,
+      __webpack_require__
+    ) => {
+      (window.__NEXT_P = window.__NEXT_P || []).push([
+        "/amp",
+        function () {
+          return __webpack_require__(6212);
+        },
+      ]);
+      if (false) {
+      }
 
       /***/
     },
 
-    /***/ 4642: /***/ (module, exports, __webpack_require__) => {
+    /***/ 9926: /***/ (module, exports, __webpack_require__) => {
       "use strict";
 
       Object.defineProperty(exports, "__esModule", {
@@ -27,8 +75,8 @@
       const _react = /*#__PURE__*/ _interop_require_default._(
         __webpack_require__(5977)
       );
-      const _ampcontextsharedruntime = __webpack_require__(8358);
-      const _ampmode = __webpack_require__(242);
+      const _ampcontextsharedruntime = __webpack_require__(5418);
+      const _ampmode = __webpack_require__(3494);
       function useAmp() {
         // Don't assign the context value to a variable to save bytes
         return (0, _ampmode.isInAmpMode)(
@@ -49,61 +97,13 @@
 
       /***/
     },
-
-    /***/ 5261: /***/ (
-      __unused_webpack_module,
-      __unused_webpack_exports,
-      __webpack_require__
-    ) => {
-      (window.__NEXT_P = window.__NEXT_P || []).push([
-        "/amp",
-        function () {
-          return __webpack_require__(9550);
-        },
-      ]);
-      if (false) {
-      }
-
-      /***/
-    },
-
-    /***/ 9550: /***/ (
-      __unused_webpack_module,
-      __webpack_exports__,
-      __webpack_require__
-    ) => {
-      "use strict";
-      __webpack_require__.r(__webpack_exports__);
-      /* harmony export */ __webpack_require__.d(__webpack_exports__, {
-        /* harmony export */ config: () => /* binding */ config,
-        /* harmony export */ default: () => /* binding */ Amp,
-        /* harmony export */
-      });
-      /* harmony import */ var next_amp__WEBPACK_IMPORTED_MODULE_0__ =
-        __webpack_require__(4105);
-      /* harmony import */ var next_amp__WEBPACK_IMPORTED_MODULE_0___default =
-        /*#__PURE__*/ __webpack_require__.n(
-          next_amp__WEBPACK_IMPORTED_MODULE_0__
-        );
-
-      const config = {
-        amp: "hybrid",
-      };
-      function Amp(props) {
-        return (0, next_amp__WEBPACK_IMPORTED_MODULE_0__.useAmp)()
-          ? "AMP mode"
-          : "normal mode";
-      }
-
-      /***/
-    },
   },
   /******/ (__webpack_require__) => {
     // webpackRuntimeModules
     /******/ var __webpack_exec__ = (moduleId) =>
       __webpack_require__((__webpack_require__.s = moduleId));
     /******/ __webpack_require__.O(0, [636, 6593, 8792], () =>
-      __webpack_exec__(5261)
+      __webpack_exec__(8647)
     );
     /******/ var __webpack_exports__ = __webpack_require__.O();
     /******/ _N_E = __webpack_exports__;
Diff for css-HASH.js 
@@ -1,7 +1,14 @@
 (self["webpackChunk_N_E"] = self["webpackChunk_N_E"] || []).push([
   [9813],
   {
-    /***/ 5267: /***/ (
+    /***/ 1978: /***/ (module) => {
+      // extracted by mini-css-extract-plugin
+      module.exports = { helloWorld: "css_helloWorld__aUdUq" };
+
+      /***/
+    },
+
+    /***/ 6941: /***/ (
       __unused_webpack_module,
       __webpack_exports__,
       __webpack_require__
@@ -15,7 +22,7 @@
       /* harmony import */ var react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__ =
         __webpack_require__(7765);
       /* harmony import */ var _css_module_css__WEBPACK_IMPORTED_MODULE_1__ =
-        __webpack_require__(6320);
+        __webpack_require__(1978);
       /* harmony import */ var _css_module_css__WEBPACK_IMPORTED_MODULE_1___default =
         /*#__PURE__*/ __webpack_require__.n(
           _css_module_css__WEBPACK_IMPORTED_MODULE_1__
@@ -35,14 +42,7 @@
       /***/
     },
 
-    /***/ 6320: /***/ (module) => {
-      // extracted by mini-css-extract-plugin
-      module.exports = { helloWorld: "css_helloWorld__aUdUq" };
-
-      /***/
-    },
-
-    /***/ 9643: /***/ (
+    /***/ 8685: /***/ (
       __unused_webpack_module,
       __unused_webpack_exports,
       __webpack_require__
@@ -50,7 +50,7 @@
       (window.__NEXT_P = window.__NEXT_P || []).push([
         "/css",
         function () {
-          return __webpack_require__(5267);
+          return __webpack_require__(6941);
         },
       ]);
       if (false) {
@@ -64,7 +64,7 @@
     /******/ var __webpack_exec__ = (moduleId) =>
       __webpack_require__((__webpack_require__.s = moduleId));
     /******/ __webpack_require__.O(0, [636, 6593, 8792], () =>
-      __webpack_exec__(9643)
+      __webpack_exec__(8685)
     );
     /******/ var __webpack_exports__ = __webpack_require__.O();
     /******/ _N_E = __webpack_exports__;
Diff for dynamic-HASH.js 
@@ -1,17 +1,63 @@
 (self["webpackChunk_N_E"] = self["webpackChunk_N_E"] || []).push([
   [2291],
   {
-    /***/ 2406: /***/ (
-      module,
-      __unused_webpack_exports,
+    /***/ 2839: /***/ (
+      __unused_webpack_module,
+      __webpack_exports__,
       __webpack_require__
     ) => {
-      module.exports = __webpack_require__(8949);
+      "use strict";
+      __webpack_require__.r(__webpack_exports__);
+      /* harmony export */ __webpack_require__.d(__webpack_exports__, {
+        /* harmony export */ __N_SSP: () => /* binding */ __N_SSP,
+        /* harmony export */ default: () => __WEBPACK_DEFAULT_EXPORT__,
+        /* harmony export */
+      });
+      /* harmony import */ var react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__ =
+        __webpack_require__(7765);
+      /* harmony import */ var next_dynamic__WEBPACK_IMPORTED_MODULE_1__ =
+        __webpack_require__(7444);
+      /* harmony import */ var next_dynamic__WEBPACK_IMPORTED_MODULE_1___default =
+        /*#__PURE__*/ __webpack_require__.n(
+          next_dynamic__WEBPACK_IMPORTED_MODULE_1__
+        );
+
+      const DynamicHello = next_dynamic__WEBPACK_IMPORTED_MODULE_1___default()(
+        () =>
+          __webpack_require__
+            .e(/* import() */ 1376)
+            .then(__webpack_require__.bind(__webpack_require__, 1376))
+            .then((mod) => mod.Hello),
+        {
+          loadableGenerated: {
+            webpack: () => [/*require.resolve*/ 1376],
+          },
+        }
+      );
+      const Page = () =>
+        /*#__PURE__*/ (0, react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsxs)(
+          react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.Fragment,
+          {
+            children: [
+              /*#__PURE__*/ (0,
+              react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)("p", {
+                children: "testing next/dynamic size",
+              }),
+              /*#__PURE__*/ (0,
+              react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(
+                DynamicHello,
+                {}
+              ),
+            ],
+          }
+        );
+      var __N_SSP = true;
+      /* harmony default export */ const __WEBPACK_DEFAULT_EXPORT__ = Page;
 
       /***/
     },
 
-    /***/ 4466: /***/ (
+    /***/ 4478: /***/ (
       __unused_webpack_module,
       exports,
       __webpack_require__
@@ -53,7 +99,7 @@ WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE SOFTWARE
       const _react = /*#__PURE__*/ _interop_require_default._(
         __webpack_require__(5977)
       );
-      const _loadablecontextsharedruntime = __webpack_require__(8452);
+      const _loadablecontextsharedruntime = __webpack_require__(5792);
       function resolve(obj) {
         return obj && obj.default ? obj.default : obj;
       }
@@ -288,63 +334,7 @@ WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE SOFTWARE
       /***/
     },
 
-    /***/ 4545: /***/ (
-      __unused_webpack_module,
-      __webpack_exports__,
-      __webpack_require__
-    ) => {
-      "use strict";
-      __webpack_require__.r(__webpack_exports__);
-      /* harmony export */ __webpack_require__.d(__webpack_exports__, {
-        /* harmony export */ __N_SSP: () => /* binding */ __N_SSP,
-        /* harmony export */ default: () => __WEBPACK_DEFAULT_EXPORT__,
-        /* harmony export */
-      });
-      /* harmony import */ var react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__ =
-        __webpack_require__(7765);
-      /* harmony import */ var next_dynamic__WEBPACK_IMPORTED_MODULE_1__ =
-        __webpack_require__(2406);
-      /* harmony import */ var next_dynamic__WEBPACK_IMPORTED_MODULE_1___default =
-        /*#__PURE__*/ __webpack_require__.n(
-          next_dynamic__WEBPACK_IMPORTED_MODULE_1__
-        );
-
-      const DynamicHello = next_dynamic__WEBPACK_IMPORTED_MODULE_1___default()(
-        () =>
-          __webpack_require__
-            .e(/* import() */ 5194)
-            .then(__webpack_require__.bind(__webpack_require__, 5194))
-            .then((mod) => mod.Hello),
-        {
-          loadableGenerated: {
-            webpack: () => [/*require.resolve*/ 5194],
-          },
-        }
-      );
-      const Page = () =>
-        /*#__PURE__*/ (0, react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsxs)(
-          react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.Fragment,
-          {
-            children: [
-              /*#__PURE__*/ (0,
-              react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)("p", {
-                children: "testing next/dynamic size",
-              }),
-              /*#__PURE__*/ (0,
-              react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(
-                DynamicHello,
-                {}
-              ),
-            ],
-          }
-        );
-      var __N_SSP = true;
-      /* harmony default export */ const __WEBPACK_DEFAULT_EXPORT__ = Page;
-
-      /***/
-    },
-
-    /***/ 8452: /***/ (
+    /***/ 5792: /***/ (
       __unused_webpack_module,
       exports,
       __webpack_require__
@@ -371,24 +361,7 @@ WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE SOFTWARE
       /***/
     },
 
-    /***/ 8931: /***/ (
-      __unused_webpack_module,
-      __unused_webpack_exports,
-      __webpack_require__
-    ) => {
-      (window.__NEXT_P = window.__NEXT_P || []).push([
-        "/dynamic",
-        function () {
-          return __webpack_require__(4545);
-        },
-      ]);
-      if (false) {
-      }
-
-      /***/
-    },
-
-    /***/ 8949: /***/ (module, exports, __webpack_require__) => {
+    /***/ 6153: /***/ (module, exports, __webpack_require__) => {
       "use strict";
 
       Object.defineProperty(exports, "__esModule", {
@@ -421,7 +394,7 @@ WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE SOFTWARE
         __webpack_require__(5977)
       );
       const _loadablesharedruntime = /*#__PURE__*/ _interop_require_default._(
-        __webpack_require__(4466)
+        __webpack_require__(4478)
       );
       const isServerSide = "object" === "undefined";
       // Normalize loader to return the module as form { default: Component } for `React.lazy`.
@@ -521,13 +494,40 @@ WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE SOFTWARE
 
       /***/
     },
+
+    /***/ 7444: /***/ (
+      module,
+      __unused_webpack_exports,
+      __webpack_require__
+    ) => {
+      module.exports = __webpack_require__(6153);
+
+      /***/
+    },
+
+    /***/ 9805: /***/ (
+      __unused_webpack_module,
+      __unused_webpack_exports,
+      __webpack_require__
+    ) => {
+      (window.__NEXT_P = window.__NEXT_P || []).push([
+        "/dynamic",
+        function () {
+          return __webpack_require__(2839);
+        },
+      ]);
+      if (false) {
+      }
+
+      /***/
+    },
   },
   /******/ (__webpack_require__) => {
     // webpackRuntimeModules
     /******/ var __webpack_exec__ = (moduleId) =>
       __webpack_require__((__webpack_require__.s = moduleId));
     /******/ __webpack_require__.O(0, [636, 6593, 8792], () =>
-      __webpack_exec__(8931)
+      __webpack_exec__(9805)
     );
     /******/ var __webpack_exports__ = __webpack_require__.O();
     /******/ _N_E = __webpack_exports__;
Diff for edge-ssr-HASH.js 
@@ -1,24 +1,7 @@
 (self["webpackChunk_N_E"] = self["webpackChunk_N_E"] || []).push([
   [676],
   {
-    /***/ 4717: /***/ (
-      __unused_webpack_module,
-      __unused_webpack_exports,
-      __webpack_require__
-    ) => {
-      (window.__NEXT_P = window.__NEXT_P || []).push([
-        "/edge-ssr",
-        function () {
-          return __webpack_require__(7776);
-        },
-      ]);
-      if (false) {
-      }
-
-      /***/
-    },
-
-    /***/ 7776: /***/ (
+    /***/ 170: /***/ (
       __unused_webpack_module,
       __webpack_exports__,
       __webpack_require__
@@ -37,13 +20,30 @@
 
       /***/
     },
+
+    /***/ 8079: /***/ (
+      __unused_webpack_module,
+      __unused_webpack_exports,
+      __webpack_require__
+    ) => {
+      (window.__NEXT_P = window.__NEXT_P || []).push([
+        "/edge-ssr",
+        function () {
+          return __webpack_require__(170);
+        },
+      ]);
+      if (false) {
+      }
+
+      /***/
+    },
   },
   /******/ (__webpack_require__) => {
     // webpackRuntimeModules
     /******/ var __webpack_exec__ = (moduleId) =>
       __webpack_require__((__webpack_require__.s = moduleId));
     /******/ __webpack_require__.O(0, [636, 6593, 8792], () =>
-      __webpack_exec__(4717)
+      __webpack_exec__(8079)
     );
     /******/ var __webpack_exports__ = __webpack_require__.O();
     /******/ _N_E = __webpack_exports__;
Diff for head-HASH.js 
@@ -1,34 +1,17 @@
 (self["webpackChunk_N_E"] = self["webpackChunk_N_E"] || []).push([
   [5350],
   {
-    /***/ 943: /***/ (
+    /***/ 1177: /***/ (
       module,
       __unused_webpack_exports,
       __webpack_require__
     ) => {
-      module.exports = __webpack_require__(2554);
+      module.exports = __webpack_require__(8366);
 
       /***/
     },
 
-    /***/ 3829: /***/ (
-      __unused_webpack_module,
-      __unused_webpack_exports,
-      __webpack_require__
-    ) => {
-      (window.__NEXT_P = window.__NEXT_P || []).push([
-        "/head",
-        function () {
-          return __webpack_require__(4662);
-        },
-      ]);
-      if (false) {
-      }
-
-      /***/
-    },
-
-    /***/ 4662: /***/ (
+    /***/ 1992: /***/ (
       __unused_webpack_module,
       __webpack_exports__,
       __webpack_require__
@@ -43,7 +26,7 @@
       /* harmony import */ var react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__ =
         __webpack_require__(7765);
       /* harmony import */ var next_head__WEBPACK_IMPORTED_MODULE_1__ =
-        __webpack_require__(943);
+        __webpack_require__(1177);
       /* harmony import */ var next_head__WEBPACK_IMPORTED_MODULE_1___default =
         /*#__PURE__*/ __webpack_require__.n(
           next_head__WEBPACK_IMPORTED_MODULE_1__
@@ -76,13 +59,30 @@
 
       /***/
     },
+
+    /***/ 8751: /***/ (
+      __unused_webpack_module,
+      __unused_webpack_exports,
+      __webpack_require__
+    ) => {
+      (window.__NEXT_P = window.__NEXT_P || []).push([
+        "/head",
+        function () {
+          return __webpack_require__(1992);
+        },
+      ]);
+      if (false) {
+      }
+
+      /***/
+    },
   },
   /******/ (__webpack_require__) => {
     // webpackRuntimeModules
     /******/ var __webpack_exec__ = (moduleId) =>
       __webpack_require__((__webpack_require__.s = moduleId));
     /******/ __webpack_require__.O(0, [636, 6593, 8792], () =>
-      __webpack_exec__(3829)
+      __webpack_exec__(8751)
     );
     /******/ var __webpack_exports__ = __webpack_require__.O();
     /******/ _N_E = __webpack_exports__;
Diff for hooks-HASH.js 
@@ -1,7 +1,24 @@
 (self["webpackChunk_N_E"] = self["webpackChunk_N_E"] || []).push([
   [9804],
   {
-    /***/ 2452: /***/ (
+    /***/ 2227: /***/ (
+      __unused_webpack_module,
+      __unused_webpack_exports,
+      __webpack_require__
+    ) => {
+      (window.__NEXT_P = window.__NEXT_P || []).push([
+        "/hooks",
+        function () {
+          return __webpack_require__(2770);
+        },
+      ]);
+      if (false) {
+      }
+
+      /***/
+    },
+
+    /***/ 2770: /***/ (
       __unused_webpack_module,
       __webpack_exports__,
       __webpack_require__
@@ -59,30 +76,13 @@
 
       /***/
     },
-
-    /***/ 6105: /***/ (
-      __unused_webpack_module,
-      __unused_webpack_exports,
-      __webpack_require__
-    ) => {
-      (window.__NEXT_P = window.__NEXT_P || []).push([
-        "/hooks",
-        function () {
-          return __webpack_require__(2452);
-        },
-      ]);
-      if (false) {
-      }
-
-      /***/
-    },
   },
   /******/ (__webpack_require__) => {
     // webpackRuntimeModules
     /******/ var __webpack_exec__ = (moduleId) =>
       __webpack_require__((__webpack_require__.s = moduleId));
     /******/ __webpack_require__.O(0, [636, 6593, 8792], () =>
-      __webpack_exec__(6105)
+      __webpack_exec__(2227)
     );
     /******/ var __webpack_exports__ = __webpack_require__.O();
     /******/ _N_E = __webpack_exports__;
Diff for image-HASH.js

Diff too large to display

Diff for link-HASH.js 
@@ -1,143 +1,82 @@
 (self["webpackChunk_N_E"] = self["webpackChunk_N_E"] || []).push([
   [4672],
   {
-    /***/ 1585: /***/ (module, exports, __webpack_require__) => {
+    /***/ 2346: /***/ (__unused_webpack_module, exports) => {
       "use strict";
 
       Object.defineProperty(exports, "__esModule", {
         value: true,
       });
-      Object.defineProperty(exports, "useIntersection", {
+      Object.defineProperty(exports, "errorOnce", {
         enumerable: true,
         get: function () {
-          return useIntersection;
+          return errorOnce;
         },
       });
-      const _react = __webpack_require__(5977);
-      const _requestidlecallback = __webpack_require__(356);
-      const hasIntersectionObserver =
-        typeof IntersectionObserver === "function";
-      const observers = new Map();
-      const idList = [];
-      function createObserver(options) {
-        const id = {
-          root: options.root || null,
-          margin: options.rootMargin || "",
-        };
-        const existing = idList.find(
-          (obj) => obj.root === id.root && obj.margin === id.margin
-        );
-        let instance;
-        if (existing) {
-          instance = observers.get(existing);
-          if (instance) {
-            return instance;
-          }
-        }
-        const elements = new Map();
-        const observer = new IntersectionObserver((entries) => {
-          entries.forEach((entry) => {
-            const callback = elements.get(entry.target);
-            const isVisible =
-              entry.isIntersecting || entry.intersectionRatio > 0;
-            if (callback && isVisible) {
-              callback(isVisible);
-            }
-          });
-        }, options);
-        instance = {
-          id,
-          observer,
-          elements,
-        };
-        idList.push(id);
-        observers.set(id, instance);
-        return instance;
-      }
-      function observe(element, callback, options) {
-        const { id, observer, elements } = createObserver(options);
-        elements.set(element, callback);
-        observer.observe(element);
-        return function unobserve() {
-          elements.delete(element);
-          observer.unobserve(element);
-          // Destroy observer when there's nothing left to watch:
-          if (elements.size === 0) {
-            observer.disconnect();
-            observers.delete(id);
-            const index = idList.findIndex(
-              (obj) => obj.root === id.root && obj.margin === id.margin
-            );
-            if (index > -1) {
-              idList.splice(index, 1);
-            }
-          }
-        };
-      }
-      function useIntersection(param) {
-        let { rootRef, rootMargin, disabled } = param;
-        const isDisabled = disabled || !hasIntersectionObserver;
-        const [visible, setVisible] = (0, _react.useState)(false);
-        const elementRef = (0, _react.useRef)(null);
-        const setElement = (0, _react.useCallback)((element) => {
-          elementRef.current = element;
-        }, []);
-        (0, _react.useEffect)(() => {
-          if (hasIntersectionObserver) {
-            if (isDisabled || visible) return;
-            const element = elementRef.current;
-            if (element && element.tagName) {
-              const unobserve = observe(
-                element,
-                (isVisible) => isVisible && setVisible(isVisible),
-                {
-                  root: rootRef == null ? void 0 : rootRef.current,
-                  rootMargin,
-                }
-              );
-              return unobserve;
-            }
-          } else {
-            if (!visible) {
-              const idleCallback = (0,
-              _requestidlecallback.requestIdleCallback)(() => setVisible(true));
-              return () =>
-                (0, _requestidlecallback.cancelIdleCallback)(idleCallback);
-            }
-          }
-          // eslint-disable-next-line react-hooks/exhaustive-deps
-        }, [isDisabled, rootMargin, rootRef, visible, elementRef.current]);
-        const resetVisible = (0, _react.useCallback)(() => {
-          setVisible(false);
-        }, []);
-        return [setElement, visible, resetVisible];
-      }
-      if (
-        (typeof exports.default === "function" ||
-          (typeof exports.default === "object" && exports.default !== null)) &&
-        typeof exports.default.__esModule === "undefined"
-      ) {
-        Object.defineProperty(exports.default, "__esModule", {
-          value: true,
-        });
-        Object.assign(exports.default, exports);
-        module.exports = exports.default;
-      } //# sourceMappingURL=use-intersection.js.map
+      let errorOnce = (_) => {};
+      if (false) {
+      } //# sourceMappingURL=error-once.js.map
 
       /***/
     },
 
-    /***/ 2621: /***/ (
+    /***/ 2783: /***/ (
       module,
       __unused_webpack_exports,
       __webpack_require__
     ) => {
-      module.exports = __webpack_require__(5410);
+      module.exports = __webpack_require__(5926);
 
       /***/
     },
 
-    /***/ 5410: /***/ (module, exports, __webpack_require__) => {
+    /***/ 4174: /***/ (
+      __unused_webpack_module,
+      __webpack_exports__,
+      __webpack_require__
+    ) => {
+      "use strict";
+      __webpack_require__.r(__webpack_exports__);
+      /* harmony export */ __webpack_require__.d(__webpack_exports__, {
+        /* harmony export */ __N_SSP: () => /* binding */ __N_SSP,
+        /* harmony export */ default: () => __WEBPACK_DEFAULT_EXPORT__,
+        /* harmony export */
+      });
+      /* harmony import */ var react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__ =
+        __webpack_require__(7765);
+      /* harmony import */ var next_link__WEBPACK_IMPORTED_MODULE_1__ =
+        __webpack_require__(2783);
+      /* harmony import */ var next_link__WEBPACK_IMPORTED_MODULE_1___default =
+        /*#__PURE__*/ __webpack_require__.n(
+          next_link__WEBPACK_IMPORTED_MODULE_1__
+        );
+
+      function aLink(props) {
+        return /*#__PURE__*/ (0,
+        react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsxs)("div", {
+          children: [
+            /*#__PURE__*/ (0,
+            react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)("h3", {
+              children: "A Link page!",
+            }),
+            /*#__PURE__*/ (0,
+            react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(
+              next_link__WEBPACK_IMPORTED_MODULE_1___default(),
+              {
+                href: "/",
+                children: "Go to /",
+              }
+            ),
+          ],
+        });
+      }
+      var __N_SSP = true;
+      /* harmony default export */ const __WEBPACK_DEFAULT_EXPORT__ = aLink;
+
+      /***/
+    },
+
+    /***/ 5926: /***/ (module, exports, __webpack_require__) => {
       "use strict";
       /* __next_internal_client_entry_do_not_use__  cjs */
       Object.defineProperty(exports, "__esModule", {
@@ -164,17 +103,17 @@
       const _react = /*#__PURE__*/ _interop_require_wildcard._(
         __webpack_require__(5977)
       );
-      const _resolvehref = __webpack_require__(224);
-      const _islocalurl = __webpack_require__(7746);
-      const _formaturl = __webpack_require__(315);
-      const _utils = __webpack_require__(8709);
-      const _addlocale = __webpack_require__(6358);
-      const _routercontextsharedruntime = __webpack_require__(4095);
-      const _useintersection = __webpack_require__(1585);
-      const _getdomainlocale = __webpack_require__(8802);
-      const _addbasepath = __webpack_require__(6151);
-      const _usemergedref = __webpack_require__(9100);
-      const _erroronce = __webpack_require__(9574);
+      const _resolvehref = __webpack_require__(6708);
+      const _islocalurl = __webpack_require__(6526);
+      const _formaturl = __webpack_require__(5575);
+      const _utils = __webpack_require__(3497);
+      const _addlocale = __webpack_require__(722);
+      const _routercontextsharedruntime = __webpack_require__(1235);
+      const _useintersection = __webpack_require__(8069);
+      const _getdomainlocale = __webpack_require__(9734);
+      const _addbasepath = __webpack_require__(4419);
+      const _usemergedref = __webpack_require__(6136);
+      const _erroronce = __webpack_require__(2346);
       const prefetched = new Set();
       function prefetch(router, href, as, options) {
         if (false) {
@@ -563,43 +502,7 @@
       /***/
     },
 
-    /***/ 8802: /***/ (module, exports, __webpack_require__) => {
-      "use strict";
-
-      Object.defineProperty(exports, "__esModule", {
-        value: true,
-      });
-      Object.defineProperty(exports, "getDomainLocale", {
-        enumerable: true,
-        get: function () {
-          return getDomainLocale;
-        },
-      });
-      const _normalizetrailingslash = __webpack_require__(1652);
-      const basePath =
-        /* unused pure expression or super */ null && (false || "");
-      function getDomainLocale(path, locale, locales, domainLocales) {
-        if (false) {
-        } else {
-          return false;
-        }
-      }
-      if (
-        (typeof exports.default === "function" ||
-          (typeof exports.default === "object" && exports.default !== null)) &&
-        typeof exports.default.__esModule === "undefined"
-      ) {
-        Object.defineProperty(exports.default, "__esModule", {
-          value: true,
-        });
-        Object.assign(exports.default, exports);
-        module.exports = exports.default;
-      } //# sourceMappingURL=get-domain-locale.js.map
-
-      /***/
-    },
-
-    /***/ 9100: /***/ (module, exports, __webpack_require__) => {
+    /***/ 6136: /***/ (module, exports, __webpack_require__) => {
       "use strict";
 
       Object.defineProperty(exports, "__esModule", {
@@ -677,26 +580,7 @@
       /***/
     },
 
-    /***/ 9574: /***/ (__unused_webpack_module, exports) => {
-      "use strict";
-
-      Object.defineProperty(exports, "__esModule", {
-        value: true,
-      });
-      Object.defineProperty(exports, "errorOnce", {
-        enumerable: true,
-        get: function () {
-          return errorOnce;
-        },
-      });
-      let errorOnce = (_) => {};
-      if (false) {
-      } //# sourceMappingURL=error-once.js.map
-
-      /***/
-    },
-
-    /***/ 9693: /***/ (
+    /***/ 7047: /***/ (
       __unused_webpack_module,
       __unused_webpack_exports,
       __webpack_require__
@@ -704,7 +588,7 @@
       (window.__NEXT_P = window.__NEXT_P || []).push([
         "/link",
         function () {
-          return __webpack_require__(9948);
+          return __webpack_require__(4174);
         },
       ]);
       if (false) {
@@ -713,48 +597,164 @@
       /***/
     },
 
-    /***/ 9948: /***/ (
-      __unused_webpack_module,
-      __webpack_exports__,
-      __webpack_require__
-    ) => {
+    /***/ 8069: /***/ (module, exports, __webpack_require__) => {
       "use strict";
-      __webpack_require__.r(__webpack_exports__);
-      /* harmony export */ __webpack_require__.d(__webpack_exports__, {
-        /* harmony export */ __N_SSP: () => /* binding */ __N_SSP,
-        /* harmony export */ default: () => __WEBPACK_DEFAULT_EXPORT__,
-        /* harmony export */
+
+      Object.defineProperty(exports, "__esModule", {
+        value: true,
       });
-      /* harmony import */ var react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__ =
-        __webpack_require__(7765);
-      /* harmony import */ var next_link__WEBPACK_IMPORTED_MODULE_1__ =
-        __webpack_require__(2621);
-      /* harmony import */ var next_link__WEBPACK_IMPORTED_MODULE_1___default =
-        /*#__PURE__*/ __webpack_require__.n(
-          next_link__WEBPACK_IMPORTED_MODULE_1__
+      Object.defineProperty(exports, "useIntersection", {
+        enumerable: true,
+        get: function () {
+          return useIntersection;
+        },
+      });
+      const _react = __webpack_require__(5977);
+      const _requestidlecallback = __webpack_require__(3432);
+      const hasIntersectionObserver =
+        typeof IntersectionObserver === "function";
+      const observers = new Map();
+      const idList = [];
+      function createObserver(options) {
+        const id = {
+          root: options.root || null,
+          margin: options.rootMargin || "",
+        };
+        const existing = idList.find(
+          (obj) => obj.root === id.root && obj.margin === id.margin
         );
-
-      function aLink(props) {
-        return /*#__PURE__*/ (0,
-        react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsxs)("div", {
-          children: [
-            /*#__PURE__*/ (0,
-            react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)("h3", {
-              children: "A Link page!",
-            }),
-            /*#__PURE__*/ (0,
-            react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(
-              next_link__WEBPACK_IMPORTED_MODULE_1___default(),
-              {
-                href: "/",
-                children: "Go to /",
-              }
-            ),
-          ],
+        let instance;
+        if (existing) {
+          instance = observers.get(existing);
+          if (instance) {
+            return instance;
+          }
+        }
+        const elements = new Map();
+        const observer = new IntersectionObserver((entries) => {
+          entries.forEach((entry) => {
+            const callback = elements.get(entry.target);
+            const isVisible =
+              entry.isIntersecting || entry.intersectionRatio > 0;
+            if (callback && isVisible) {
+              callback(isVisible);
+            }
+          });
+        }, options);
+        instance = {
+          id,
+          observer,
+          elements,
+        };
+        idList.push(id);
+        observers.set(id, instance);
+        return instance;
+      }
+      function observe(element, callback, options) {
+        const { id, observer, elements } = createObserver(options);
+        elements.set(element, callback);
+        observer.observe(element);
+        return function unobserve() {
+          elements.delete(element);
+          observer.unobserve(element);
+          // Destroy observer when there's nothing left to watch:
+          if (elements.size === 0) {
+            observer.disconnect();
+            observers.delete(id);
+            const index = idList.findIndex(
+              (obj) => obj.root === id.root && obj.margin === id.margin
+            );
+            if (index > -1) {
+              idList.splice(index, 1);
+            }
+          }
+        };
+      }
+      function useIntersection(param) {
+        let { rootRef, rootMargin, disabled } = param;
+        const isDisabled = disabled || !hasIntersectionObserver;
+        const [visible, setVisible] = (0, _react.useState)(false);
+        const elementRef = (0, _react.useRef)(null);
+        const setElement = (0, _react.useCallback)((element) => {
+          elementRef.current = element;
+        }, []);
+        (0, _react.useEffect)(() => {
+          if (hasIntersectionObserver) {
+            if (isDisabled || visible) return;
+            const element = elementRef.current;
+            if (element && element.tagName) {
+              const unobserve = observe(
+                element,
+                (isVisible) => isVisible && setVisible(isVisible),
+                {
+                  root: rootRef == null ? void 0 : rootRef.current,
+                  rootMargin,
+                }
+              );
+              return unobserve;
+            }
+          } else {
+            if (!visible) {
+              const idleCallback = (0,
+              _requestidlecallback.requestIdleCallback)(() => setVisible(true));
+              return () =>
+                (0, _requestidlecallback.cancelIdleCallback)(idleCallback);
+            }
+          }
+          // eslint-disable-next-line react-hooks/exhaustive-deps
+        }, [isDisabled, rootMargin, rootRef, visible, elementRef.current]);
+        const resetVisible = (0, _react.useCallback)(() => {
+          setVisible(false);
+        }, []);
+        return [setElement, visible, resetVisible];
+      }
+      if (
+        (typeof exports.default === "function" ||
+          (typeof exports.default === "object" && exports.default !== null)) &&
+        typeof exports.default.__esModule === "undefined"
+      ) {
+        Object.defineProperty(exports.default, "__esModule", {
+          value: true,
         });
+        Object.assign(exports.default, exports);
+        module.exports = exports.default;
+      } //# sourceMappingURL=use-intersection.js.map
+
+      /***/
+    },
+
+    /***/ 9734: /***/ (module, exports, __webpack_require__) => {
+      "use strict";
+
+      Object.defineProperty(exports, "__esModule", {
+        value: true,
+      });
+      Object.defineProperty(exports, "getDomainLocale", {
+        enumerable: true,
+        get: function () {
+          return getDomainLocale;
+        },
+      });
+      const _normalizetrailingslash = __webpack_require__(504);
+      const basePath =
+        /* unused pure expression or super */ null && (false || "");
+      function getDomainLocale(path, locale, locales, domainLocales) {
+        if (false) {
+        } else {
+          return false;
+        }
       }
-      var __N_SSP = true;
-      /* harmony default export */ const __WEBPACK_DEFAULT_EXPORT__ = aLink;
+      if (
+        (typeof exports.default === "function" ||
+          (typeof exports.default === "object" && exports.default !== null)) &&
+        typeof exports.default.__esModule === "undefined"
+      ) {
+        Object.defineProperty(exports.default, "__esModule", {
+          value: true,
+        });
+        Object.assign(exports.default, exports);
+        module.exports = exports.default;
+      } //# sourceMappingURL=get-domain-locale.js.map
 
       /***/
     },
@@ -764,7 +764,7 @@
     /******/ var __webpack_exec__ = (moduleId) =>
       __webpack_require__((__webpack_require__.s = moduleId));
     /******/ __webpack_require__.O(0, [636, 6593, 8792], () =>
-      __webpack_exec__(9693)
+      __webpack_exec__(7047)
     );
     /******/ var __webpack_exports__ = __webpack_require__.O();
     /******/ _N_E = __webpack_exports__;
Diff for script-HASH.js 
@@ -1,7 +1,34 @@
 (self["webpackChunk_N_E"] = self["webpackChunk_N_E"] || []).push([
   [1209],
   {
-    /***/ 3699: /***/ (
+    /***/ 1008: /***/ (
+      module,
+      __unused_webpack_exports,
+      __webpack_require__
+    ) => {
+      module.exports = __webpack_require__(2817);
+
+      /***/
+    },
+
+    /***/ 6951: /***/ (
+      __unused_webpack_module,
+      __unused_webpack_exports,
+      __webpack_require__
+    ) => {
+      (window.__NEXT_P = window.__NEXT_P || []).push([
+        "/script",
+        function () {
+          return __webpack_require__(8889);
+        },
+      ]);
+      if (false) {
+      }
+
+      /***/
+    },
+
+    /***/ 8889: /***/ (
       __unused_webpack_module,
       __webpack_exports__,
       __webpack_require__
@@ -16,7 +43,7 @@
       /* harmony import */ var react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__ =
         __webpack_require__(7765);
       /* harmony import */ var next_script__WEBPACK_IMPORTED_MODULE_1__ =
-        __webpack_require__(4802);
+        __webpack_require__(1008);
       /* harmony import */ var next_script__WEBPACK_IMPORTED_MODULE_1___default =
         /*#__PURE__*/ __webpack_require__.n(
           next_script__WEBPACK_IMPORTED_MODULE_1__
@@ -48,40 +75,13 @@
 
       /***/
     },
-
-    /***/ 4802: /***/ (
-      module,
-      __unused_webpack_exports,
-      __webpack_require__
-    ) => {
-      module.exports = __webpack_require__(8661);
-
-      /***/
-    },
-
-    /***/ 7861: /***/ (
-      __unused_webpack_module,
-      __unused_webpack_exports,
-      __webpack_require__
-    ) => {
-      (window.__NEXT_P = window.__NEXT_P || []).push([
-        "/script",
-        function () {
-          return __webpack_require__(3699);
-        },
-      ]);
-      if (false) {
-      }
-
-      /***/
-    },
   },
   /******/ (__webpack_require__) => {
     // webpackRuntimeModules
     /******/ var __webpack_exec__ = (moduleId) =>
       __webpack_require__((__webpack_require__.s = moduleId));
     /******/ __webpack_require__.O(0, [636, 6593, 8792], () =>
-      __webpack_exec__(7861)
+      __webpack_exec__(6951)
     );
     /******/ var __webpack_exports__ = __webpack_require__.O();
     /******/ _N_E = __webpack_exports__;
Diff for 2256-HASH.js

Diff too large to display

Diff for 8863-HASH.js 
@@ -1,8 +1,33 @@
 "use strict";
 (self["webpackChunk_N_E"] = self["webpackChunk_N_E"] || []).push([
-  [8863],
+  [7009],
   {
-    /***/ 22: /***/ (module, exports, __webpack_require__) => {
+    /***/ 414: /***/ (
+      __unused_webpack_module,
+      exports,
+      __webpack_require__
+    ) => {
+      Object.defineProperty(exports, "__esModule", {
+        value: true,
+      });
+      Object.defineProperty(exports, "AmpStateContext", {
+        enumerable: true,
+        get: function () {
+          return AmpStateContext;
+        },
+      });
+      const _interop_require_default = __webpack_require__(2726);
+      const _react = /*#__PURE__*/ _interop_require_default._(
+        __webpack_require__(2224)
+      );
+      const AmpStateContext = _react.default.createContext({});
+      if (false) {
+      } //# sourceMappingURL=amp-context.shared-runtime.js.map
+
+      /***/
+    },
+
+    /***/ 1912: /***/ (module, exports, __webpack_require__) => {
       Object.defineProperty(exports, "__esModule", {
         value: true,
       });
@@ -12,7 +37,7 @@
           return useMergedRef;
         },
       });
-      const _react = __webpack_require__(2786);
+      const _react = __webpack_require__(2224);
       function useMergedRef(refA, refB) {
         const cleanupA = (0, _react.useRef)(null);
         const cleanupB = (0, _react.useRef)(null);
@@ -78,56 +103,99 @@
       /***/
     },
 
-    /***/ 936: /***/ (__unused_webpack_module, exports) => {
+    /***/ 2843: /***/ (
+      __unused_webpack_module,
+      exports,
+      __webpack_require__
+    ) => {
       Object.defineProperty(exports, "__esModule", {
         value: true,
       });
-      0 && 0;
-      function _export(target, all) {
-        for (var name in all)
-          Object.defineProperty(target, name, {
-            enumerable: true,
-            get: all[name],
-          });
-      }
-      _export(exports, {
-        VALID_LOADERS: function () {
-          return VALID_LOADERS;
+      Object.defineProperty(exports, "RouterContext", {
+        enumerable: true,
+        get: function () {
+          return RouterContext;
         },
-        imageConfigDefault: function () {
-          return imageConfigDefault;
+      });
+      const _interop_require_default = __webpack_require__(2726);
+      const _react = /*#__PURE__*/ _interop_require_default._(
+        __webpack_require__(2224)
+      );
+      const RouterContext = _react.default.createContext(null);
+      if (false) {
+      } //# sourceMappingURL=router-context.shared-runtime.js.map
+
+      /***/
+    },
+
+    /***/ 3003: /***/ (__unused_webpack_module, exports) => {
+      Object.defineProperty(exports, "__esModule", {
+        value: true,
+      });
+      Object.defineProperty(exports, "default", {
+        enumerable: true,
+        get: function () {
+          return _default;
         },
       });
-      const VALID_LOADERS = [
-        "default",
-        "imgix",
-        "cloudinary",
-        "akamai",
-        "custom",
-      ];
-      const imageConfigDefault = {
-        deviceSizes: [640, 750, 828, 1080, 1200, 1920, 2048, 3840],
-        imageSizes: [16, 32, 48, 64, 96, 128, 256, 384],
-        path: "/_next/image",
-        loader: "default",
-        loaderFile: "",
-        domains: [],
-        disableStaticImages: false,
-        minimumCacheTTL: 60,
-        formats: ["image/webp"],
-        dangerouslyAllowSVG: false,
-        contentSecurityPolicy: "script-src 'none'; frame-src 'none'; sandbox;",
-        contentDispositionType: "attachment",
-        localPatterns: undefined,
-        remotePatterns: [],
-        qualities: undefined,
-        unoptimized: false,
-      }; //# sourceMappingURL=image-config.js.map
+      const DEFAULT_Q = 75;
+      function defaultLoader(param) {
+        let { config, src, width, quality } = param;
+        var _config_qualities;
+        if (false) {
+        }
+        const q =
+          quality ||
+          ((_config_qualities = config.qualities) == null
+            ? void 0
+            : _config_qualities.reduce((prev, cur) =>
+                Math.abs(cur - DEFAULT_Q) < Math.abs(prev - DEFAULT_Q)
+                  ? cur
+                  : prev
+              )) ||
+          DEFAULT_Q;
+        return (
+          config.path +
+          "?url=" +
+          encodeURIComponent(src) +
+          "&w=" +
+          width +
+          "&q=" +
+          q +
+          (src.startsWith("/_next/static/media/") && false ? 0 : "")
+        );
+      }
+      // We use this to determine if the import is the default loader
+      // or a custom loader defined by the user in next.config.js
+      defaultLoader.__next_img_default = true;
+      const _default = defaultLoader; //# sourceMappingURL=image-loader.js.map
 
       /***/
     },
 
-    /***/ 1268: /***/ (__unused_webpack_module, exports) => {
+    /***/ 3810: /***/ (__unused_webpack_module, exports) => {
+      Object.defineProperty(exports, "__esModule", {
+        value: true,
+      });
+      Object.defineProperty(exports, "isInAmpMode", {
+        enumerable: true,
+        get: function () {
+          return isInAmpMode;
+        },
+      });
+      function isInAmpMode(param) {
+        let {
+          ampFirst = false,
+          hybrid = false,
+          hasQuery = false,
+        } = param === void 0 ? {} : param;
+        return ampFirst || (hybrid && hasQuery);
+      } //# sourceMappingURL=amp-mode.js.map
+
+      /***/
+    },
+
+    /***/ 5218: /***/ (__unused_webpack_module, exports) => {
       /**
        * A shared function, used on both client and server, to generate a SVG blur placeholder.
        */
@@ -181,7 +249,7 @@
       /***/
     },
 
-    /***/ 1796: /***/ (module, exports, __webpack_require__) => {
+    /***/ 5402: /***/ (module, exports, __webpack_require__) => {
       /* __next_internal_client_entry_do_not_use__  cjs */
       Object.defineProperty(exports, "__esModule", {
         value: true,
@@ -202,19 +270,19 @@
           return defaultHead;
         },
       });
-      const _interop_require_default = __webpack_require__(8182);
-      const _interop_require_wildcard = __webpack_require__(8319);
-      const _jsxruntime = __webpack_require__(1050);
+      const _interop_require_default = __webpack_require__(2726);
+      const _interop_require_wildcard = __webpack_require__(2527);
+      const _jsxruntime = __webpack_require__(8204);
       const _react = /*#__PURE__*/ _interop_require_wildcard._(
-        __webpack_require__(2786)
+        __webpack_require__(2224)
       );
       const _sideeffect = /*#__PURE__*/ _interop_require_default._(
-        __webpack_require__(5581)
+        __webpack_require__(9319)
       );
-      const _ampcontextsharedruntime = __webpack_require__(3800);
-      const _headmanagercontextsharedruntime = __webpack_require__(4950);
-      const _ampmode = __webpack_require__(7824);
-      const _warnonce = __webpack_require__(2854);
+      const _ampcontextsharedruntime = __webpack_require__(414);
+      const _headmanagercontextsharedruntime = __webpack_require__(3100);
+      const _ampmode = __webpack_require__(3810);
+      const _warnonce = __webpack_require__(4504);
       function defaultHead(inAmpMode) {
         if (inAmpMode === void 0) inAmpMode = false;
         const head = [
@@ -379,7 +447,7 @@
       /***/
     },
 
-    /***/ 2843: /***/ (
+    /***/ 6745: /***/ (
       __unused_webpack_module,
       exports,
       __webpack_require__
@@ -393,9 +461,9 @@
           return getImgProps;
         },
       });
-      const _warnonce = __webpack_require__(2854);
-      const _imageblursvg = __webpack_require__(1268);
-      const _imageconfig = __webpack_require__(936);
+      const _warnonce = __webpack_require__(4504);
+      const _imageblursvg = __webpack_require__(5218);
+      const _imageconfig = __webpack_require__(9278);
       const VALID_LOADING_VALUES =
         /* unused pure expression or super */ null && [
           "lazy",
@@ -822,245 +890,7 @@
       /***/
     },
 
-    /***/ 3800: /***/ (
-      __unused_webpack_module,
-      exports,
-      __webpack_require__
-    ) => {
-      Object.defineProperty(exports, "__esModule", {
-        value: true,
-      });
-      Object.defineProperty(exports, "AmpStateContext", {
-        enumerable: true,
-        get: function () {
-          return AmpStateContext;
-        },
-      });
-      const _interop_require_default = __webpack_require__(8182);
-      const _react = /*#__PURE__*/ _interop_require_default._(
-        __webpack_require__(2786)
-      );
-      const AmpStateContext = _react.default.createContext({});
-      if (false) {
-      } //# sourceMappingURL=amp-context.shared-runtime.js.map
-
-      /***/
-    },
-
-    /***/ 5581: /***/ (
-      __unused_webpack_module,
-      exports,
-      __webpack_require__
-    ) => {
-      Object.defineProperty(exports, "__esModule", {
-        value: true,
-      });
-      Object.defineProperty(exports, "default", {
-        enumerable: true,
-        get: function () {
-          return SideEffect;
-        },
-      });
-      const _react = __webpack_require__(2786);
-      const isServer = "object" === "undefined";
-      const useClientOnlyLayoutEffect = isServer
-        ? () => {}
-        : _react.useLayoutEffect;
-      const useClientOnlyEffect = isServer ? () => {} : _react.useEffect;
-      function SideEffect(props) {
-        const { headManager, reduceComponentsToState } = props;
-        function emitChange() {
-          if (headManager && headManager.mountedInstances) {
-            const headElements = _react.Children.toArray(
-              Array.from(headManager.mountedInstances).filter(Boolean)
-            );
-            headManager.updateHead(
-              reduceComponentsToState(headElements, props)
-            );
-          }
-        }
-        if (isServer) {
-          var _headManager_mountedInstances;
-          headManager == null
-            ? void 0
-            : (_headManager_mountedInstances = headManager.mountedInstances) ==
-              null
-            ? void 0
-            : _headManager_mountedInstances.add(props.children);
-          emitChange();
-        }
-        useClientOnlyLayoutEffect(() => {
-          var _headManager_mountedInstances;
-          headManager == null
-            ? void 0
-            : (_headManager_mountedInstances = headManager.mountedInstances) ==
-              null
-            ? void 0
-            : _headManager_mountedInstances.add(props.children);
-          return () => {
-            var _headManager_mountedInstances;
-            headManager == null
-              ? void 0
-              : (_headManager_mountedInstances =
-                  headManager.mountedInstances) == null
-              ? void 0
-              : _headManager_mountedInstances.delete(props.children);
-          };
-        });
-        // We need to call `updateHead` method whenever the `SideEffect` is trigger in all
-        // life-cycles: mount, update, unmount. However, if there are multiple `SideEffect`s
-        // being rendered, we only trigger the method from the last one.
-        // This is ensured by keeping the last unflushed `updateHead` in the `_pendingUpdate`
-        // singleton in the layout effect pass, and actually trigger it in the effect pass.
-        useClientOnlyLayoutEffect(() => {
-          if (headManager) {
-            headManager._pendingUpdate = emitChange;
-          }
-          return () => {
-            if (headManager) {
-              headManager._pendingUpdate = emitChange;
-            }
-          };
-        });
-        useClientOnlyEffect(() => {
-          if (headManager && headManager._pendingUpdate) {
-            headManager._pendingUpdate();
-            headManager._pendingUpdate = null;
-          }
-          return () => {
-            if (headManager && headManager._pendingUpdate) {
-              headManager._pendingUpdate();
-              headManager._pendingUpdate = null;
-            }
-          };
-        });
-        return null;
-      } //# sourceMappingURL=side-effect.js.map
-
-      /***/
-    },
-
-    /***/ 7053: /***/ (
-      __unused_webpack_module,
-      exports,
-      __webpack_require__
-    ) => {
-      Object.defineProperty(exports, "__esModule", {
-        value: true,
-      });
-      Object.defineProperty(exports, "RouterContext", {
-        enumerable: true,
-        get: function () {
-          return RouterContext;
-        },
-      });
-      const _interop_require_default = __webpack_require__(8182);
-      const _react = /*#__PURE__*/ _interop_require_default._(
-        __webpack_require__(2786)
-      );
-      const RouterContext = _react.default.createContext(null);
-      if (false) {
-      } //# sourceMappingURL=router-context.shared-runtime.js.map
-
-      /***/
-    },
-
-    /***/ 7281: /***/ (__unused_webpack_module, exports) => {
-      Object.defineProperty(exports, "__esModule", {
-        value: true,
-      });
-      Object.defineProperty(exports, "default", {
-        enumerable: true,
-        get: function () {
-          return _default;
-        },
-      });
-      const DEFAULT_Q = 75;
-      function defaultLoader(param) {
-        let { config, src, width, quality } = param;
-        var _config_qualities;
-        if (false) {
-        }
-        const q =
-          quality ||
-          ((_config_qualities = config.qualities) == null
-            ? void 0
-            : _config_qualities.reduce((prev, cur) =>
-                Math.abs(cur - DEFAULT_Q) < Math.abs(prev - DEFAULT_Q)
-                  ? cur
-                  : prev
-              )) ||
-          DEFAULT_Q;
-        return (
-          config.path +
-          "?url=" +
-          encodeURIComponent(src) +
-          "&w=" +
-          width +
-          "&q=" +
-          q +
-          (src.startsWith("/_next/static/media/") && false ? 0 : "")
-        );
-      }
-      // We use this to determine if the import is the default loader
-      // or a custom loader defined by the user in next.config.js
-      defaultLoader.__next_img_default = true;
-      const _default = defaultLoader; //# sourceMappingURL=image-loader.js.map
-
-      /***/
-    },
-
-    /***/ 7480: /***/ (
-      __unused_webpack_module,
-      exports,
-      __webpack_require__
-    ) => {
-      Object.defineProperty(exports, "__esModule", {
-        value: true,
-      });
-      Object.defineProperty(exports, "ImageConfigContext", {
-        enumerable: true,
-        get: function () {
-          return ImageConfigContext;
-        },
-      });
-      const _interop_require_default = __webpack_require__(8182);
-      const _react = /*#__PURE__*/ _interop_require_default._(
-        __webpack_require__(2786)
-      );
-      const _imageconfig = __webpack_require__(936);
-      const ImageConfigContext = _react.default.createContext(
-        _imageconfig.imageConfigDefault
-      );
-      if (false) {
-      } //# sourceMappingURL=image-config-context.shared-runtime.js.map
-
-      /***/
-    },
-
-    /***/ 7824: /***/ (__unused_webpack_module, exports) => {
-      Object.defineProperty(exports, "__esModule", {
-        value: true,
-      });
-      Object.defineProperty(exports, "isInAmpMode", {
-        enumerable: true,
-        get: function () {
-          return isInAmpMode;
-        },
-      });
-      function isInAmpMode(param) {
-        let {
-          ampFirst = false,
-          hybrid = false,
-          hasQuery = false,
-        } = param === void 0 ? {} : param;
-        return ampFirst || (hybrid && hasQuery);
-      } //# sourceMappingURL=amp-mode.js.map
-
-      /***/
-    },
-
-    /***/ 8863: /***/ (module, exports, __webpack_require__) => {
+    /***/ 7009: /***/ (module, exports, __webpack_require__) => {
       /* __next_internal_client_entry_do_not_use__  cjs */
       Object.defineProperty(exports, "__esModule", {
         value: true,
@@ -1071,27 +901,27 @@
           return Image;
         },
       });
-      const _interop_require_default = __webpack_require__(8182);
-      const _interop_require_wildcard = __webpack_require__(8319);
-      const _jsxruntime = __webpack_require__(1050);
+      const _interop_require_default = __webpack_require__(2726);
+      const _interop_require_wildcard = __webpack_require__(2527);
+      const _jsxruntime = __webpack_require__(8204);
       const _react = /*#__PURE__*/ _interop_require_wildcard._(
-        __webpack_require__(2786)
+        __webpack_require__(2224)
       );
       const _reactdom = /*#__PURE__*/ _interop_require_default._(
-        __webpack_require__(1407)
+        __webpack_require__(1345)
       );
       const _head = /*#__PURE__*/ _interop_require_default._(
-        __webpack_require__(1796)
+        __webpack_require__(5402)
       );
-      const _getimgprops = __webpack_require__(2843);
-      const _imageconfig = __webpack_require__(936);
-      const _imageconfigcontextsharedruntime = __webpack_require__(7480);
-      const _warnonce = __webpack_require__(2854);
-      const _routercontextsharedruntime = __webpack_require__(7053);
+      const _getimgprops = __webpack_require__(6745);
+      const _imageconfig = __webpack_require__(9278);
+      const _imageconfigcontextsharedruntime = __webpack_require__(9690);
+      const _warnonce = __webpack_require__(4504);
+      const _routercontextsharedruntime = __webpack_require__(2843);
       const _imageloader = /*#__PURE__*/ _interop_require_default._(
-        __webpack_require__(7281)
+        __webpack_require__(3003)
       );
-      const _usemergedref = __webpack_require__(22);
+      const _usemergedref = __webpack_require__(1912);
       // This is replaced by webpack define plugin
       const configEnv = {
         deviceSizes: [640, 750, 828, 1080, 1200, 1920, 2048, 3840],
@@ -1416,5 +1246,175 @@
 
       /***/
     },
+
+    /***/ 9278: /***/ (__unused_webpack_module, exports) => {
+      Object.defineProperty(exports, "__esModule", {
+        value: true,
+      });
+      0 && 0;
+      function _export(target, all) {
+        for (var name in all)
+          Object.defineProperty(target, name, {
+            enumerable: true,
+            get: all[name],
+          });
+      }
+      _export(exports, {
+        VALID_LOADERS: function () {
+          return VALID_LOADERS;
+        },
+        imageConfigDefault: function () {
+          return imageConfigDefault;
+        },
+      });
+      const VALID_LOADERS = [
+        "default",
+        "imgix",
+        "cloudinary",
+        "akamai",
+        "custom",
+      ];
+      const imageConfigDefault = {
+        deviceSizes: [640, 750, 828, 1080, 1200, 1920, 2048, 3840],
+        imageSizes: [16, 32, 48, 64, 96, 128, 256, 384],
+        path: "/_next/image",
+        loader: "default",
+        loaderFile: "",
+        domains: [],
+        disableStaticImages: false,
+        minimumCacheTTL: 60,
+        formats: ["image/webp"],
+        dangerouslyAllowSVG: false,
+        contentSecurityPolicy: "script-src 'none'; frame-src 'none'; sandbox;",
+        contentDispositionType: "attachment",
+        localPatterns: undefined,
+        remotePatterns: [],
+        qualities: undefined,
+        unoptimized: false,
+      }; //# sourceMappingURL=image-config.js.map
+
+      /***/
+    },
+
+    /***/ 9319: /***/ (
+      __unused_webpack_module,
+      exports,
+      __webpack_require__
+    ) => {
+      Object.defineProperty(exports, "__esModule", {
+        value: true,
+      });
+      Object.defineProperty(exports, "default", {
+        enumerable: true,
+        get: function () {
+          return SideEffect;
+        },
+      });
+      const _react = __webpack_require__(2224);
+      const isServer = "object" === "undefined";
+      const useClientOnlyLayoutEffect = isServer
+        ? () => {}
+        : _react.useLayoutEffect;
+      const useClientOnlyEffect = isServer ? () => {} : _react.useEffect;
+      function SideEffect(props) {
+        const { headManager, reduceComponentsToState } = props;
+        function emitChange() {
+          if (headManager && headManager.mountedInstances) {
+            const headElements = _react.Children.toArray(
+              Array.from(headManager.mountedInstances).filter(Boolean)
+            );
+            headManager.updateHead(
+              reduceComponentsToState(headElements, props)
+            );
+          }
+        }
+        if (isServer) {
+          var _headManager_mountedInstances;
+          headManager == null
+            ? void 0
+            : (_headManager_mountedInstances = headManager.mountedInstances) ==
+              null
+            ? void 0
+            : _headManager_mountedInstances.add(props.children);
+          emitChange();
+        }
+        useClientOnlyLayoutEffect(() => {
+          var _headManager_mountedInstances;
+          headManager == null
+            ? void 0
+            : (_headManager_mountedInstances = headManager.mountedInstances) ==
+              null
+            ? void 0
+            : _headManager_mountedInstances.add(props.children);
+          return () => {
+            var _headManager_mountedInstances;
+            headManager == null
+              ? void 0
+              : (_headManager_mountedInstances =
+                  headManager.mountedInstances) == null
+              ? void 0
+              : _headManager_mountedInstances.delete(props.children);
+          };
+        });
+        // We need to call `updateHead` method whenever the `SideEffect` is trigger in all
+        // life-cycles: mount, update, unmount. However, if there are multiple `SideEffect`s
+        // being rendered, we only trigger the method from the last one.
+        // This is ensured by keeping the last unflushed `updateHead` in the `_pendingUpdate`
+        // singleton in the layout effect pass, and actually trigger it in the effect pass.
+        useClientOnlyLayoutEffect(() => {
+          if (headManager) {
+            headManager._pendingUpdate = emitChange;
+          }
+          return () => {
+            if (headManager) {
+              headManager._pendingUpdate = emitChange;
+            }
+          };
+        });
+        useClientOnlyEffect(() => {
+          if (headManager && headManager._pendingUpdate) {
+            headManager._pendingUpdate();
+            headManager._pendingUpdate = null;
+          }
+          return () => {
+            if (headManager && headManager._pendingUpdate) {
+              headManager._pendingUpdate();
+              headManager._pendingUpdate = null;
+            }
+          };
+        });
+        return null;
+      } //# sourceMappingURL=side-effect.js.map
+
+      /***/
+    },
+
+    /***/ 9690: /***/ (
+      __unused_webpack_module,
+      exports,
+      __webpack_require__
+    ) => {
+      Object.defineProperty(exports, "__esModule", {
+        value: true,
+      });
+      Object.defineProperty(exports, "ImageConfigContext", {
+        enumerable: true,
+        get: function () {
+          return ImageConfigContext;
+        },
+      });
+      const _interop_require_default = __webpack_require__(2726);
+      const _react = /*#__PURE__*/ _interop_require_default._(
+        __webpack_require__(2224)
+      );
+      const _imageconfig = __webpack_require__(9278);
+      const ImageConfigContext = _react.default.createContext(
+        _imageconfig.imageConfigDefault
+      );
+      if (false) {
+      } //# sourceMappingURL=image-config-context.shared-runtime.js.map
+
+      /***/
+    },
   },
 ]);
Diff for main-HASH.js

Diff too large to display

Diff for server.runtime.prod.js

Diff too large to display

Commit: d314313

@sokra sokra force-pushed the sokra/module-factory-function-name branch from cd18f19 to 8238121 Compare December 6, 2024 08:54
@sokra sokra force-pushed the sokra/hide-method-names branch from 00efb1e to 680d59f Compare December 6, 2024 08:54
@sokra sokra force-pushed the sokra/module-factory-function-name branch from 8238121 to 011e151 Compare December 9, 2024 07:34
@sokra sokra force-pushed the sokra/hide-method-names branch from 680d59f to 70b48dc Compare December 9, 2024 07:34
@sokra sokra force-pushed the sokra/module-factory-function-name branch from 011e151 to 304ebeb Compare December 19, 2024 08:28
@sokra sokra force-pushed the sokra/hide-method-names branch from 70b48dc to 17044d1 Compare December 19, 2024 08:28
@sokra sokra force-pushed the sokra/module-factory-function-name branch from 304ebeb to ba1434f Compare December 19, 2024 10:25
@sokra sokra force-pushed the sokra/hide-method-names branch from 17044d1 to 50b5505 Compare December 19, 2024 10:25
@sokra sokra force-pushed the sokra/module-factory-function-name branch from ba1434f to 099b794 Compare December 19, 2024 11:58
@sokra sokra force-pushed the sokra/hide-method-names branch from 50b5505 to 759c89f Compare December 19, 2024 11:58
@sokra sokra force-pushed the sokra/module-factory-function-name branch from 099b794 to 806b3b9 Compare December 20, 2024 12:33
@sokra sokra force-pushed the sokra/hide-method-names branch from 759c89f to 49669a4 Compare December 20, 2024 12:34
@sokra sokra force-pushed the sokra/module-factory-function-name branch 2 times, most recently from f4cf432 to f1bb2ed Compare December 20, 2024 15:36
@sokra sokra force-pushed the sokra/hide-method-names branch from 49669a4 to 7f7c72d Compare December 20, 2024 15:36
eps1lon
eps1lon reviewed Jan 6, 2025
View reviewed changes
Copy link
Member

@eps1lon eps1lon left a comment

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Can you sourcemap these instead to empty function names so that it's consistent with terminals and debuggers? We should just display no function name as at ${location}.

@sokra sokra force-pushed the sokra/module-factory-function-name branch from f1bb2ed to e9a06b0 Compare January 14, 2025 20:24
@sokra sokra force-pushed the sokra/hide-method-names branch from 7f7c72d to 3083c28 Compare January 14, 2025 20:25
@sokra sokra force-pushed the sokra/module-factory-function-name branch from e9a06b0 to 6360f68 Compare February 3, 2025 07:07
@sokra sokra force-pushed the sokra/hide-method-names branch from 3083c28 to 6843cdb Compare February 3, 2025 07:07
@sokra sokra changed the title hide useless method names Turbopack: hide useless method names Mar 12, 2025
@sokra sokra force-pushed the sokra/module-factory-function-name branch from 6360f68 to a3d158d Compare March 12, 2025 10:13
@sokra sokra force-pushed the sokra/hide-method-names branch from a7caae7 to cfa159b Compare July 23, 2025 23:16
@sokra sokra force-pushed the graphite-base/73586 branch from b873e5d to 75e7279 Compare July 23, 2025 23:16
@sokra sokra changed the base branch from graphite-base/73586 to sokra/module-factory-function-name July 23, 2025 23:16
@sokra sokra changed the base branch from sokra/module-factory-function-name to graphite-base/73586 July 24, 2025 00:15
@sokra sokra force-pushed the sokra/hide-method-names branch from cfa159b to 64be62b Compare July 24, 2025 00:16
@sokra sokra changed the base branch from graphite-base/73586 to sokra/module-factory-function-name July 24, 2025 00:17
@sokra sokra requested a review from timneutkens July 24, 2025 00:19
@sokra sokra marked this pull request as ready for review July 24, 2025 00:19
eps1lon
eps1lon requested changes Jul 24, 2025
View reviewed changes
Copy link
Member

@eps1lon eps1lon left a comment

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

These names should be mapped names instead of mappings. We don't want to manually adjust them in error inspection or Redbox because that doesn't integrate with debuggers.

@sokra
Copy link
Member Author

sokra commented Jul 24, 2025

Can you sourcemap these instead to empty function names so that it's consistent with terminals and debuggers? We should just display no function name as at ${location}.

They had no function name before. The problem is that browser "infer" a name when there is non. That's why I did give them a name to avoid that. eval() isn't even a function, it's more a "source", which I can't give a name. anonymous is the fallback name when the browser can't infer a better name.

@sokra sokra force-pushed the sokra/module-factory-function-name branch from 9b9d282 to 92a0388 Compare July 25, 2025 08:15
@sokra sokra force-pushed the sokra/hide-method-names branch from 30ac250 to cd90d21 Compare July 25, 2025 08:15
@sokra sokra changed the base branch from sokra/module-factory-function-name to graphite-base/73586 July 25, 2025 08:51
@sokra sokra force-pushed the graphite-base/73586 branch from 92a0388 to 78cfbeb Compare July 25, 2025 10:54
@sokra sokra force-pushed the sokra/hide-method-names branch from cd90d21 to 2db4877 Compare July 25, 2025 10:54
@sokra sokra changed the base branch from graphite-base/73586 to sokra/module-factory-function-name July 25, 2025 10:55
@lukesandberg lukesandberg changed the base branch from sokra/module-factory-function-name to graphite-base/73586 August 2, 2025 14:18
@lukesandberg lukesandberg mentioned this pull request Aug 2, 2025
Merged
@sokra sokra force-pushed the sokra/hide-method-names branch from 2db4877 to 2bc5802 Compare August 3, 2025 04:30
@sokra sokra force-pushed the graphite-base/73586 branch from 78cfbeb to bbcdcea Compare August 3, 2025 04:30
@sokra sokra changed the base branch from graphite-base/73586 to canary August 3, 2025 04:30
vercel[bot]
vercel bot reviewed Aug 3, 2025
View reviewed changes
packages/next/src/next-devtools/dev-overlay/components/code-frame/code-frame.tsx
@@ -9,6 +9,7 @@ import {
groupCodeFrameLines,
parseLineNumberFromCodeFrameLine,
} from './parse-code-frame'
import { isHiddenMethodName } from 'next/src/shared/lib/stack-trace-utils'
Copy link
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

The import path for isHiddenMethodName is incorrect and will cause a build failure, referencing the published package instead of the local source file.

View Details

Analysis

The import statement import { isHiddenMethodName } from 'next/src/shared/lib/stack-trace-utils' is incorrect. It attempts to import from the published next package (next/src/...) rather than from the local source code within the same package. This will cause a build error because the function is not exported from the published package, and the path structure doesn't match the actual package exports.

Other files in the same changeset correctly use relative imports:

  • call-stack-frame.tsx uses '../../../../shared/lib/stack-trace-utils'
  • patch-error-inspect.ts uses '../shared/lib/stack-trace-utils'

The file structure shows that code-frame.tsx is at packages/next/src/next-devtools/dev-overlay/components/code-frame/ and the target file is at packages/next/src/shared/lib/, so the correct relative path should be ../../../../shared/lib/stack-trace-utils.

Recommendation

Change the import statement on line 12 from:

import { isHiddenMethodName } from 'next/src/shared/lib/stack-trace-utils'

to:

import { isHiddenMethodName } from '../../../../shared/lib/stack-trace-utils'

@sokra sokra force-pushed the sokra/hide-method-names branch from 2bc5802 to d314313 Compare August 6, 2025 11:57
@sokra sokra requested a review from eps1lon August 6, 2025 11:58
eps1lon
eps1lon requested changes Aug 6, 2025
View reviewed changes
packages/next/src/shared/lib/stack-trace-utils.ts
Comment on lines +3 to +5
return /^(?:Object\.|Module\.)?(?:<anonymous>|eval|__TURBOPACK__module__evaluation__)$/.test(
methodName
)
Copy link
Member

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

I don't understand why we would hide these names. eval and <anonymous> I can maybe see but that should apply everywhere. The rest should be sourcemapped names.

sokra
sokra commented Aug 11, 2025
View reviewed changes
Copy link
Member Author

@sokra sokra left a comment

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

I changed my mind. We should keep these function names. They are helpful when debugging even when it doesn't match native stack traces. But stack traces are not specified and implementation specific, so Turbopack can have different stack traces and that's ok. Especially if they are more useful than the native stack traces.

Not having a function name is too easy to confuse with other functions that doesn't have a function name.

@sokra sokra closed this Aug 11, 2025
@github-actions github-actions bot locked as resolved and limited conversation to collaborators Aug 26, 2025
Sign up for free to subscribe to this conversation on GitHub. Already have an account? Sign in.
Reviewers

@vercel vercel[bot] vercel[bot] left review comments

@eps1lon eps1lon eps1lon requested changes

@timneutkens timneutkens Awaiting requested review from timneutkens

Assignees
No one assigned
Labels
created-by: Turbopack team PRs by the Turbopack team. locked tests type: next
Projects
None yet
Milestone
No milestone
Development

Successfully merging this pull request may close these issues.
3 participants
@sokra @ijjk @eps1lon