Jak funguje Streaming SSR se Suspense v Next.js?

Question

Accepted Answer

**Streaming SSR** umožňuje serveru poslat HTML do prohlížeče **po částech, jak jsou připraveny**, místo čekání na vykreslení celé stránky. Pomalé části neblokují rychlé části — uživatel vidí obsah postupně. React `` definuje hranice streaming. ## Problém, který streaming řeší Bez streaming, pokud jedna sekce potřebuje pomalý dotaz do databáze, **celá stránka** na něj čeká předtím, než je odeslán jakýkoliv HTML — uživatel kouká na prázdnou obrazovku. Streaming pošle shell a rychlý obsah okamžitě, poté streamuje pomalé části, jak se dokončují. ## Použití Suspense pro streaming ```tsx import { Suspense } from "react"; export default function Page() { return ( <>

{/* sent immediately */} }> {/* streams independently */} {/* an async Server Component */}

Jak funguje Streaming SSR se Suspense v Next.js?

Problém, který streaming řeší

Použití Suspense pro streaming

loading.tsx je automatické Suspense

Proč streaming pomáhá klíčovým metrikám

Proč na tom záleží