Next.js 15 Programmatic SEO Architecture

[ User / Googlebot ]
        │
        ▼
[ Edge CDN Cache (Mumbai / Delhi / Bengaluru) ] ── (HIT: < 45ms TTFB) ──▶ Instant HTML Delivery
        │
        ▼ (MISS: Stale / Uncached)
[ Next.js 15 App Router Edge Runtime ]
        │
        ▼
[ React Server Component (RSC) + Cached Database Layer (pgBouncer / Supabase) ]
        │
        ▼
[ Background Incremental Static Regeneration (ISR) ] ──▶ Persists to Global Edge Storage

// app/[industry]/[city]/page.tsx
import { Metadata } from 'next';
import { notFound } from 'next/navigation';
import { fetchProgrammaticPageData, getTopPrioritySlugs } from '@/lib/seo-engine';

export const revalidate = 86400; // 24-hour baseline stale-while-revalidate cache
export const dynamicParams = true; // Compile long-tail URLs on-demand

interface PageProps {
  params: Promise<{ industry: string; city: string }>;
}

export async function generateStaticParams() {
  // Pre-render top 250 high-volume hubs during CI build
  const topPaths = await getTopPrioritySlugs();
  return topPaths.map(({ industry, city }) => ({ industry, city }));
}

export async function generateMetadata({ params }: PageProps): Promise<Metadata> {
  const { industry, city } = await params;
  const data = await fetchProgrammaticPageData(industry, city);
  if (!data) return {};

  return {
    title: `${data.headline} in ${data.cityName} | Enterprise Implementation`,
    description: `Deploy custom ${data.industryName} workflows in ${data.cityName}. measured performance, local compliance, and guaranteed ROI.`,
    alternates: {
      canonical: `https://kaamlabs.in/${industry}/${city}`,
    },
  };
}

export default async function ProgrammaticLandingPage({ params }: PageProps) {
  const { industry, city } = await params;
  const page = await fetchProgrammaticPageData(industry, city);

  if (!page) notFound();

  return (
    <article className="max-w-5xl mx-auto px-6 py-16">
      <header className="mb-12">
        <span className="text-xs font-mono uppercase tracking-widest text-emerald-400">
          Local Enterprise Infrastructure • {page.cityName}
        </span>
        <h1 className="text-4xl md:text-5xl font-bold mt-4 tracking-tight">
          {page.headline}
        </h1>
        <p className="text-lg text-neutral-400 mt-4 max-w-2xl leading-relaxed">
          {page.subheadline}
        </p>
      </header>

      {/* Dynamic Localized Case Studies and Metrics */}
      <section className="grid grid-cols-1 md:grid-cols-3 gap-6 my-12">
        <div className="p-6 rounded-2xl bg-neutral-900 border border-neutral-800">
          <div className="text-3xl font-mono font-bold text-white">{page.metricSpeed}</div>
          <div className="text-sm text-neutral-400 mt-1">Average Mobile TTFB</div>
        </div>
        <div className="p-6 rounded-2xl bg-neutral-900 border border-neutral-800">
          <div className="text-3xl font-mono font-bold text-emerald-400">{page.metricRoi}</div>
          <div className="text-sm text-neutral-400 mt-1">First-Year Operational ROI</div>
        </div>
        <div className="p-6 rounded-2xl bg-neutral-900 border border-neutral-800">
          <div className="text-3xl font-mono font-bold text-blue-400">{page.metricUptime}</div>
          <div className="text-sm text-neutral-400 mt-1">Production Availability</div>
        </div>
      </section>
    </article>
  );
}