generateStaticParams in Next.js

generateStaticParams allows Next.js to pre-build dynamic routes at build time instead of generating them on demand.

What is generateStaticParams?

It tells Next.js which dynamic route values should be statically generated ahead of time.

How does it work?

export async function generateStaticParams() {
  return [{ id: "1" }, { id: "2" }];
}

During build, Next.js creates static pages for each parameter.

Why use it?

• Faster page loading
• SEO-friendly static pages
• No runtime generation needed
• Better scalability

Real-World Example

A blog site pre-builds pages for known articles so visitors see instant loading without server delay.

Example Data

• First post
• Second post

Interview Tip

generateStaticParams pre-builds dynamic routes during deployment, enabling static rendering and faster performance.