Serve un `loading.tsx` per fare streaming?

No. Basta un ` ` nel punto giusto. `loading.tsx` avvolge l'intero segmento e va bene solo quando la pagina carica tutta insieme.

Lo streaming rallenta il server?

No, il lavoro totale è lo stesso. Cambia la distribuzione: il primo byte parte prima e i pezzi arrivano man mano.

Posso mettere un confine dentro un client component?

Sì, ma il figlio sospeso deve essere un server component passato come children. Un client component non può renderizzare un async component.

Come evito il layout shift dallo skeleton?

Dai al fallback la stessa altezza del contenuto finale, con `min-height` o una griglia di righe fisse. Il resto lo misura il browser.

Lo streaming funziona con l'export statico?

No. Con `output: "export"` la pagina è un file completo e non c'è server che possa inviare pezzi dopo il primo byte.

React

Streaming e Suspense nell'App Router

Lo streaming manda la shell mentre il server lavora. Dove mettere il confine Suspense, cosa costa e quando non serve: struttura, codice e limiti.

2026-11-01

In sintesi

Un confine `` attorno al widget lento basta: la shell parte subito.
`loading.tsx` avvolge il segmento intero e perde la granularità dei pannelli.
Lo skeleton deve avere l'altezza del contenuto finale, altrimenti produce CLS.
Una pagina statica è prerenderizzata: non fa streaming e il confine non serve.

Lo streaming manda l'HTML al browser mentre il server sta ancora lavorando: la struttura compare subito e i dati lenti arrivano dopo. Nell'App Router basta un confine `` attorno al pezzo lento.

Cosa succede davvero

React renderizza il tree sul server e manda il primo chunk con la shell: header, titolo, skeleton. Quando una promise si risolve, il frammento arriva come `