Why does my Next.js app’s performance drop significantly when using dynamic routes with large datasets and server-side rendering (SSR)?

I'm working on a Next.js 14 app with several dynamic routes (e.g., /product/[id]) that render product details from a large dataset (around 50k+ records) stored in PostgreSQL.

I'm using getServerSideProps to fetch data for each page:

export async function getServerSideProps({ params }) {
  const product = await db.products.findUnique({
    where: { id: params.id },
    include: { category: true, reviews: true },
  });

  return { props: { product } };
}