Problem: Single await at page top blocked all rendering until the billing API (P95: 2.8 s) responded. Most page content — invoice history, account details — was static and did not need the slow API.
Solution: Next.js PPR separated the static shell (served instantly from edge cache) from the dynamic usage summary (Suspense-wrapped, streamed separately). Redis cache on the aggregation endpoint with 30-second TTL brought API P95 from 2.8 s to 220 ms for repeat loads within the billing period.
Technology: Next.js 15 PPR · React Suspense · Redis · Vercel Edge
Optimisation pattern: full-page-ssr-await-to-partial-prerender-with-suspense-streaming
Outcomes:
FCP: 3.4 s → 780 ms. Time to full interactive: 3.4 s → 1.1 s. Billing-related support tickets: dropped to zero. CSAT for billing section: +18 points.