Bumped Next JS

packages/app-next-js/AGENTS.md

@@ -0,0 +1,9 @@
+<!-- BEGIN:nextjs-agent-rules -->
+
+## This is NOT the Next.js you know
+
+This version has breaking changes — APIs, conventions, and file structure may all differ from your training data. Read the relevant guide in `node_modules/next/dist/docs/` (resolved from this file's directory; in monorepos the `next` package may not be visible from the repo root) before writing any code. Heed deprecation notices.
+
+This block is written and re-added by `next dev` — verify at `node_modules/next/dist/server/lib/generate-agent-files.js`. Removing it from a diff only re-creates the uncommitted change; committing it with your work keeps the tree clean.
+
+<!-- END:nextjs-agent-rules -->

packages/app-next-js/app/client-side-rendered/[id]/ClientSideRenderedDetail.tsx

@@ -0,0 +1,9 @@
+'use client'
+
+import { useParams } from 'next/navigation'
+
+export default function ClientSideRenderedDetail() {
+  const params = useParams<{ id: string }>()
+
+  return <p id="detail-id">{params.id}</p>
+}

packages/app-next-js/app/client-side-rendered/[id]/page.tsx

@@ -1,9 +1,17 @@
 'use client'
 
-import { useParams } from 'next/navigation'
+import { Suspense } from 'react'
+import dynamic from 'next/dynamic'
 
-export default function ClientSideRenderedDetailPage() {
-  const params = useParams<{ id: string }>()
+const ClientSideRenderedDetail = dynamic(
+  () => import('./ClientSideRenderedDetail'),
+  { ssr: false },
+)
 
-  return <p id="detail-id">{params.id}</p>
+export default function ClientSideRenderedDetailPage() {
+  return (
+    <Suspense fallback={null}>
+      <ClientSideRenderedDetail />
+    </Suspense>
+  )
 }

packages/app-next-js/app/client-side-rendered/page.tsx

@@ -1,5 +1,6 @@
 'use client'
 
+import { Suspense } from 'react'
 import dynamic from 'next/dynamic'
 
 const ClientSideRenderedTable = dynamic(
@@ -8,5 +9,9 @@ const ClientSideRenderedTable = dynamic(
 )
 
 export default function ClientSideRenderedPage() {
-  return <ClientSideRenderedTable />
+  return (
+    <Suspense fallback={null}>
+      <ClientSideRenderedTable />
+    </Suspense>
+  )
 }

packages/app-next-js/app/page.tsx

@@ -1,8 +1,15 @@
-export const dynamic = 'force-dynamic'
-
-import { testData } from '../../testdata/src/ssr'
+import { Suspense } from 'react'
+import { getTestData } from '../data'
 import { Table } from './table'
 
-export default async function App() {
-  return <Table data={await testData()} />
+export default function App() {
+  return (
+    <Suspense fallback={null}>
+      <RequestTable />
+    </Suspense>
+  )
+}
+
+async function RequestTable() {
+  return <Table data={await getTestData()} />
 }

packages/app-next-js/app/server-side-rendered-plain-links/page.tsx

@@ -1,9 +1,16 @@
-import { testData } from '../../../testdata/src/ssr'
+import { Suspense } from 'react'
+import { getTestData } from '../../data'
 
-export const dynamic = 'force-dynamic'
+export default function ServerSideRenderedPage() {
+  return (
+    <Suspense fallback={null}>
+      <RequestTable />
+    </Suspense>
+  )
+}
 
-export default async function ServerSideRenderedPage() {
-  const entries = await testData()
+async function RequestTable() {
+  const entries = await getTestData()
 
   return (
     <table>

packages/app-next-js/app/server-side-rendered/[id]/page.tsx

@@ -1,8 +1,18 @@
+import { Suspense } from 'react'
+
 interface Props {
   params: Promise<{ id: string }>
 }
 
-export default async function ServerSideRenderedDetailPage({ params }: Props) {
+export default function ServerSideRenderedDetailPage({ params }: Props) {
+  return (
+    <Suspense fallback={null}>
+      <RequestDetail params={params} />
+    </Suspense>
+  )
+}
+
+async function RequestDetail({ params }: Props) {
   const { id } = await params
 
   return <p id="detail-id">{id}</p>

packages/app-next-js/app/server-side-rendered/page.tsx

@@ -1,10 +1,17 @@
+import { Suspense } from 'react'
 import Link from 'next/link'
-import { testData } from '../../../testdata/src/ssr'
+import { getTestData } from '../../data'
 
-export const dynamic = 'force-dynamic'
+export default function ServerSideRenderedPage() {
+  return (
+    <Suspense fallback={null}>
+      <RequestTable />
+    </Suspense>
+  )
+}
 
-export default async function ServerSideRenderedPage() {
-  const entries = await testData()
+async function RequestTable() {
+  const entries = await getTestData()
 
   return (
     <table>

packages/app-next-js/app/ssr-throughput/page.tsx

@@ -1,8 +1,15 @@
-import { testData } from '../../../testdata/src/ssr'
+import { Suspense } from 'react'
+import { getTestData } from '../../data'
 import { Table } from './table'
 
-export const dynamic = 'force-dynamic'
+export default function SSRThroughputPage() {
+  return (
+    <Suspense fallback={null}>
+      <RequestTable />
+    </Suspense>
+  )
+}
 
-export default async function SSRThroughputPage() {
-  return <Table data={await testData()} />
+async function RequestTable() {
+  return <Table data={await getTestData()} />
 }

packages/app-next-js/data.ts

@@ -0,0 +1,8 @@
+import { connection } from 'next/server'
+
+export async function getTestData() {
+  await connection()
+  // The shared fixture creates UUIDs once per module instance, at request time.
+  const { testData } = await import('../testdata/src/ssr')
+  return testData()
+}

packages/app-next-js/next.config.mjs

@@ -1,4 +1,7 @@
 /** @type {import('next').NextConfig} */
-const nextConfig = {}
+const nextConfig = {
+  cacheComponents: true,
+  partialPrefetching: true,
+}
 
 export default nextConfig

packages/app-next-js/package.json

@@ -10,12 +10,12 @@
     "type-check": "tsc --noEmit"
   },
   "dependencies": {
-    "next": "16.3.8",
+    "next": "16.4.0",
     "react": "19.3.0",
     "react-dom": "19.3.0"
   },
   "devDependencies": {
-    "@types/node": "25.9.8",
+    "@types/node": "25.9.9",
     "@types/react": "19.3.0",
     "@types/react-dom": "19.3.0",
     "typescript": "6.0.3"