Partial Prerendering (PPR) in Next.js

// next.config.ts  (Next.js 16 - PPR via Cache Components)
import type { NextConfig } from 'next'
const nextConfig: NextConfig = {
  cacheComponents: true, // replaces experimental.ppr / dynamicIO / useCache
}
export default nextConfig

// app/product/[id]/page.tsx  (no per-route flag needed in 16)
import { Suspense } from 'react'

export default async function Page({ params }: { params: Promise<{ id: string }> }) {
  const { id } = await params
  return (
    <main>
      <ProductDetails id={id} />          {/* prerendered shell */}
      <Suspense fallback={<CartFallback />}>
        <Cart />                          {/* dynamic hole, streamed in */}
      </Suspense>
    </main>
  )
}