rendering-models

Choose between SSR and CSR by mapping route requirements against a time-place model across build, request, stream, and interaction phases. Select SSR for crawlable content and CSR for highly interactive dashboards, evaluating FCP, LCP, and TTI trade-offs.

Streaming SSR sends HTML in chunks to improve LCP, while React Server Components (RSC) execute exclusively on the server to reduce client hydration costs. Both target performance metrics but differ in execution model and client-side hydration requirements.

Use edge rendering instead of traditional server-side rendering when you need lower latency for global users by processing requests closer to them. It satisfies dynamic content constraints while improving FCP and TTI compared to centralized origin servers.

Partial prerendering helps with hydration cost and INP metrics by statically generating static shell content while streaming dynamic holes. This reduces client-side JavaScript execution, lowering interaction latency and improving overall page responsiveness.

Architect web routing for mixed pages by applying per-route rendering model selection. Use SSG or ISR for static marketing pages, streaming SSR for personalized dashboards, and CSR for real-time widgets, balancing cache behavior and crawlability constraints.

SSR can yield poor Core Web Vitals if heavy hydration delays TTI and INP. Evaluate streaming SSR or RSC to reduce client JavaScript, and verify your cache strategy and server response times are not bottlenecking FCP and LCP metrics.