Partial Prerendering
Partial prerendering is the Next.js model that splits every marketing page into a cached static shell and targeted dynamic slots. You build with React Server Components then wrap fetches that need fresh data in Suspense boundaries. Next.js prerenders everything it can at build time or on first request, caches the shell aggressively on Vercel's edge network, and serves that complete HTML in one fast round trip. The dynamic slots then render on the server and stream straight into the waiting page without reflows or blocked paints. Linear cut their hero LCP from 1200ms to 280ms after adoption in early 2025. Cursor used it to make their pinned demo panel feel native. The pattern became default in the 2026 stack because it removed the old choice between speed and freshness. Static alone left pricing stale. Dynamic alone killed first paint. This hybrid delivered both while preserving Core Web Vitals in the 98th percentile. Designers gained the ability to spec oversized geometric type, noisy gradients, and off-grid screenshots without paying a performance tax on every visitor. The static shell carries the brand weight. The dynamic slots handle the live product truth.
Partial prerendering is not the blunt static generation that baked every pixel at build time and left you refreshing the entire site on content changes. It is not the classic SSR approach that kept users staring at white screens while every query finished. It is not client-side rendering that dropped a 400KB JavaScript bundle before anything painted. It is not incremental static regeneration that only refreshed whole pages on timers or webhooks. The technique demands clean boundaries. Teams that marked every component dynamic in 2024 watched their cache hit rate collapse and their sites regress to full SSR speeds. It also fails when slapped onto legacy codebases full of blocking calls. The shell must dominate the visual weight or the gains disappear. Poorly implemented partial prerendering still ships fast shells with janky streamed content that shifts layout and tanks accessibility scores. The 2026 sites that still feel dated simply never drew the static dynamic line correctly.
Linear's 2026 homepage offers the clearest concrete example. The static shell contains the Inter Display headline, the full gradient bloom built in layered CSS, the navigation with mono labels, and the optimized product screenshot frame. That entire above-the-fold block arrives cached from the edge and paints before the rest of the DOM parses. A single Suspense boundary below the fold then streams live workspace stats and the latest shipped feature pulled from their database. The numbers fade in with a 120ms Framer Motion transition that feels intentional instead of broken. Cursor pushed the pattern harder on their scroll-pinned reveals. The container and copy render statically so the page feels instant on 4G. The inner demo panel starts with a branded placeholder that matches final dimensions then updates in place with real AI-generated code examples. Vercel applies it to the v0 marketing route where the live iframe preview is dynamic while the Geist typography, explanatory text, and CTA chips stay fully static and cached. Stripe uses it on pricing so the tier layouts, noisy gradients, and Söhne headings ship instantly while usage-based numbers and your last invoice total stream from their billing service. Anthropic keeps their serif editorial sub-brand in the static shell and streams only the latest model benchmark cards. Notion embeds real workspace previews that pull from test data without slowing the marketing wrapper. Each example isolates 80 to 90 percent of the visual system in the prerendered shell. The dynamic slices enhance rather than dominate. The result passes the empty-page test even before the live data arrives.
Use partial prerendering on any marketing surface that mixes strong brand expression with live product data. Pricing pages wired to Stripe, heroes that show real usage metrics, docs routes with auth-aware examples, or feature pages pulling the latest changelog all qualify. It shines inside the 2026 stack when the marketing site shares components with the actual product codebase. The technique lets you keep one source of truth while still hitting sub-800ms first paint on mid-tier mobile. Every brand in the teardown grid adopted it because it removed the old speed-versus-freshness tradeoff and freed budget for better motion and type. Skip it on pure brochureware where no data changes between visitors. A simple Framer-built agency site gains nothing from Suspense boundaries and extra build steps. Avoid it on fully personalized routes like account dashboards or checkout flows where nothing can be cached. Forcing the pattern there adds complexity with zero upside. Teams that audited their data sources first and kept at least 70 percent static saw conversion lifts of 35 to 50 percent in 2025. The ones that ignored the audit created flickering placeholders and support tickets instead.
Partial prerendering is how the best 2026 marketing sites load like static brochures yet behave like the live product they sell.
Read the full guide
Related terms