23. Rendering Strategies: SSG, SSR, Hybrid & CSR

// Rendering Architecture Comparison Matrix
export type RenderingStrategy = 'SSG' | 'SSR' | 'HYBRID' | 'CSR';

export interface StrategyMetrics {
  name: RenderingStrategy;
  ttfbMs: number;
  fcpMs: number;
  computeCost: 'Zero (Static CDN)' | 'Dynamic Serverless' | 'Client Heavy';
  useCase: string;
}

export const strategies: Record<RenderingStrategy, StrategyMetrics> = {
  SSG: {
    name: 'SSG',
    ttfbMs: 15,
    fcpMs: 120,
    computeCost: 'Zero (Static CDN)',
    useCase: 'Documentation, Marketing, Knowledge Portals, Product Catalogs'
  },
  SSR: {
    name: 'SSR',
    ttfbMs: 180,
    fcpMs: 340,
    computeCost: 'Dynamic Serverless',
    useCase: 'Personalized Dashboards, Dynamic Social Feeds, Real-time Stock Data'
  },
  HYBRID: {
    name: 'HYBRID',
    ttfbMs: 25,
    fcpMs: 150,
    computeCost: 'Dynamic Serverless',
    useCase: 'E-commerce (Static Shell + Streaming Product & Inventory)'
  },
  CSR: {
    name: 'CSR',
    ttfbMs: 20,
    fcpMs: 650,
    computeCost: 'Client Heavy',
    useCase: 'Single Page Web Applications behind strict user login'
  }
};