Next.jsmedium

What is `loading.tsx` in the App Router and how does it relate to streaming?

Answer

`loading.tsx` provides a route‑segment loading UI that is shown while the segment is being streamed or suspended. It works with React Suspense and lets users see partial UI earlier instead of waiting for the whole page.

Related questions

Next.js

App Router data fetching: what do `cache: 'no-store'` and `revalidate` change?

#nextjs#fetch#cache

Next.js

Static vs dynamic rendering in the App Router: what makes a route dynamic?

#nextjs#rendering#static

Next.js

`next/link` prefetching: what does it do and how can you control it?

#nextjs#link#prefetch

Next.js

Middleware in Next.js: what is it good for and what are its limitations?

#nextjs#middleware#edge

Next.js

Route Handlers in the App Router: how do you define them and what are they used for?

#nextjs#route-handlers#api

Next.js

Cache invalidation: what do `revalidatePath` and `revalidateTag` do?

#nextjs#cache#revalidate