/Knowledge/sources/honojs__hono/llms-full/jsx-suspense--d8a5c0b75db0.md
JSX: Suspense - hono-docs
JSX: Suspense Source evidence: /Sources/honojs hono/provenance.md Canonical citation: https://hono.dev/llms full.txt suspense Summary The React like Suspense...
JSX: Suspense
Source evidence: /Sources/honojs__hono/provenance.md Canonical citation: https://hono.dev/llms-full.txt#suspense
Summary
The React-like Suspense feature is available. If you wrap the async component with Suspense, the content in the fallback will be rendered first, and once the Promise is resolved, the awaited content will be displayed. You can use it...
Content
The React-like Suspense feature is available.
If you wrap the async component with Suspense, the content in the fallback will be rendered first, and once the Promise is resolved, the awaited content will be displayed.
You can use it with renderToReadableStream().
import { renderToReadableStream, Suspense } from 'hono/jsx/streaming'
//...
app.get('/', (c) => {
const stream = renderToReadableStream(
<html>
<body>
<Suspense fallback={<div>loading...</div>}>
<Component />
</Suspense>
</body>
</html>
)
return c.body(stream, {
headers: {
'Content-Type': 'text/html; charset=UTF-8',
'Transfer-Encoding': 'chunked',
},
})
})
Metadata
{
"chunk_index": 0,
"citation": "https://hono.dev/llms-full.txt#suspense",
"coverage_role": "overview",
"qualified_title": "Hono / llms-full / JSX > Suspense",
"retrieved_at": "2026-07-02T05:51:01Z",
"section_index": 24,
"source_id": "/honojs/hono",
"source_type": "llms_full",
"target_label": "llms-full",
"title": "JSX: Suspense",
"upstream_url": "https://hono.dev/llms-full.txt",
"version": "2026"
}