Back to results for “Static Site Generation (SSG) & Hydration”
React › Static Site Generation (SSG) & Hydration

How would you decide between static site generation and server side rendering for a specific page?

Advanced

Answer

Choose static site generation for content that is the same for every visitor and does not change extremely often, like a blog post or a marketing page, since it can be built once and served instantly to everyone. Choose server side rendering for content that must be fresh on every single request or is personalized per user, like a dashboard showing a specific user's private data.
// Good fit for static generation, same content for everyone
export default async function AboutPage() {
  return <AboutContent />;
}

// Good fit for server side rendering, personalized per visitor
export default async function Dashboard({ userId }) {
  const data = await getPersonalizedData(userId);
  return <DashboardView data={data} />;
}
Real-world example A company website statically generates its about page and pricing page, which rarely change, while server rendering its personalized account dashboard fresh on every request, since that content is unique to each logged in user.

Common follow-ups: Can a single app mix both static generation and server side rendering across different pages?;What role does incremental static regeneration play as a middle ground between the two?