Loading UI with loading.js and streaming
Answer: loading.js creates Loading UI with React Suspense. Streaming lets the browser start rendering HTML while the server continues generating the rest.
See also
Claims
- id: C1 claim: loading.js creates Loading UI with Suspense. source: S1 evidence: "The special file
loading.jshelps you create meaningful Loading UI with"
- id: C2 claim: Traditional SSR waits for full HTML. source: S2 evidence: "the server produces the full HTML document before sending anything."
- id: C3 claim: Streaming paints while the server continues. source: S2 evidence: "The browser starts rendering HTML while the server is still generating the rest."
- id: C4 claim: App Router streams without extra configuration. source: S2 evidence: "Next.js integrates this into the App Router so streaming works without additional configuration."
Sources
- [S1] loading.js. Next.js docs. https://nextjs.org/docs/app/api-reference/file-conventions/loading . License: MIT (vercel/next.js). Accessed 2026-11-09.
- [S2] Streaming. Next.js docs. https://nextjs.org/docs/app/guides/streaming . License: MIT (vercel/next.js). Accessed 2026-11-09.
License: this note is CC BY 4.0 (https://creativecommons.org/licenses/by/4.0/). Summary by iinventedlight (AI-assisted). Copyright (c) 2025 Vercel, Inc. Sources: Next.js docs (vercel/next.js on GitHub / nextjs.org), MIT (https://raw.githubusercontent.com/vercel/next.js/canary/license.md). Text was condensed and changed from the originals.
License: CC-BY-4.0 · Summary by iinventedlight (AI-assisted). Sources: Next.js docs, loading.js, MIT (vercel/next.js); Next.js docs, Streaming, MIT (vercel/next.js). Copyright (c) 2025 Vercel, Inc. MIT (https://raw.githubusercontent.com/vercel/next.js/canary/license.md).
Cite this
iinventedlight. 2026. "Loading UI with loading.js and streaming." iinventedlight Library, iil:note:gd5xyj11, version of 2026-11-09. https://iinventedlight.com/library/notes/nextjs-loading-ui/. License: CC-BY-4.0.
@misc{iil_note_gd5xyj11,
author = {{iinventedlight}},
title = {{Loading UI with loading.js and streaming}},
howpublished = {iinventedlight Library},
year = {2026},
date = {2026-11-09},
url = {https://iinventedlight.com/library/notes/nextjs-loading-ui/},
note = {Permanent ID iil:note:gd5xyj11. License: CC-BY-4.0.},
}
Spotted a mistake? Use the MCP feedback tool or email hello@iinventedlight.com.
For language models and agents: start at /llms.txt | /agents.md | /.well-known/agent-library.json. This page in Markdown: /library/notes/nextjs-loading-ui.md.