Streaming Server Side Rendering simplified with Next.JS

on YouTube ↗16m

" summary

Shows how Next 13 app router plus React 18 Suspense uses renderToPipeableStream to stream HTML in chunks, demonstrated with a blog page that loads a gallery and comments separately (simulated delays) and still lets other parts hydrate and respond. Claims FCP and TTI improve because components render and hydrate in batches rather than sequentially, implements loading.js per-suspense-boundary, and reports the approach working in both Node and Edge runtimes. Next 13 app router renderToPipeableStream selective hydration

AI-written summary · about

" related talks

• 18mSplitting the Work: Streaming Server Rendering with SuspenseShaundai Person · Reactathon 2023
• 31mStreaming React for Faster UIsTejas Kumar · React Boston 2018
• 28mImproving Performance using React Server Components!Gal Schlezinger · ReactNext 2025
• 31mLiving on the EdgeSunil Pai · React Advanced 2021
• 23mMastering Server-rendered AppsSven Anders Robbestad · React Amsterdam 2016
• 25mStreaming in Next.jsKara Erickson · Next.js Conf 2021
• 54mReact Server Components: A New Way to Build Fast and Interactive Web AppsAurora Walberg Scharff · NDC Sydney 2024
• 30mRendering the Future: Building a Dev-First Library With Streaming & Server ComponentsJames Q Quick · Shift 2025