Yunhan

Posted on Mar 23

Generating 3,000+ Static Pages with Next.js: Lessons from a Baby Name Site

#javascript #nextjs #webdev #performance

BabyNamePick generates over 3,000 static pages at build time. Here's what that looks like in practice and what we learned.

The Page Breakdown

2,000+ individual name pages (/name/[slug])
46 cultural origin pages (/[category])
26 letter index pages (/letter/[letter])
130+ blog posts (/blog/[slug])
Homepage, about, privacy, etc.

Total: ~3,400 pages, all pre-rendered as static HTML.

The Build Process

Next.js generateStaticParams does the heavy lifting:

// For name pages
export function generateStaticParams() {
  return namePool.map(name => ({
    slug: name.name.toLowerCase().replace(/\s+/g, '-')
  }));
}

Each page gets its own metadata, structured data (JSON-LD), and internal links — all computed at build time.

Build Time Reality

With 3,400 pages, builds take 3-5 minutes on Vercel. That's acceptable for a site that deploys a few times per week. The tradeoff is worth it:

Zero runtime compute
Sub-50ms TTFB globally
$0 hosting cost
100% uptime

Lessons Learned

1. Structured Data at Scale

Every name page includes Schema.org markup:

{
  "@type": "DefinedTerm",
  "name": "Sakura",
  "description": "Cherry blossom",
  "inDefinedTermSet": "Japanese Baby Names"
}

Every category page includes FAQPage schema. This helps Google understand the content and can trigger rich snippets.

2. Internal Linking is Everything

With thousands of pages, internal linking creates a web that helps both users and search engines navigate. Every name page links to its origin category. Every category links to related categories. Every blog post links to relevant names.

3. Sitemap Generation

A dynamic sitemap that includes all 3,400+ URLs with proper lastmod dates helps Google discover and index pages efficiently.

4. Image Optimization

We use Next.js generateImageMetadata for dynamic OG images rather than pre-generating 3,400 images. This keeps build times manageable while still providing social sharing previews.

When Static Breaks Down

Static generation works perfectly for our use case because:

Content changes infrequently (weekly name additions)
No user-generated content
No personalization needed at the page level

The AI name generator is the one dynamic feature — it runs client-side, calling an API for suggestions based on user preferences.

The Numbers

After one month:

80%+ pages indexed by Google
Growing organic impressions
Perfect Lighthouse scores
Zero downtime

For content-heavy sites with deterministic data, static generation remains the best approach in 2026.

BabyNamePick — 2,000+ baby names from 46 cultures. Free, no signup.

DEV Community