PickAFramework
Emil Ness1

Streaming with Suspense

Shell loads instantly, content streams in progressively.

Shell rendered at:2026-01-15T14:48:46.937Z

The shell (header, nav, this card) loads immediately. The metrics below stream in after 2s, the chart after 3s. Each Suspense boundary can show its own loading state.

Implementation

import { Suspense } from 'react'

export default function Page() {
  return (
    <>
      {/* Shell renders immediately */}
      <Header />

      {/* Metrics stream in */}
      <Suspense fallback={<MetricsSkeleton />}>
        <SlowMetrics />
      </Suspense>

      {/* Chart streams independently */}
      <Suspense fallback={<ChartSkeleton />}>
        <SlowChart />
      </Suspense>
    </>
  )
}

Traffic Over Time

MonTueWedThuFriSatSun