Skip to content

Instantly share code, notes, and snippets.

@subtleGradient

subtleGradient/CurrentServerTime.server.tsx

Last active March 21, 2024 01:30
Show Gist options
  • Save subtleGradient/40104417bbf7b48f060ac9197832a7e5 to your computer and use it in GitHub Desktop.
Save subtleGradient/40104417bbf7b48f060ac9197832a7e5 to your computer and use it in GitHub Desktop.
Download ZIP
example of what a re-renderable React server component could maybe look like?
Raw
CurrentServerTime.server.tsx
"use server"
import { $ } from "bun"
export async function* CurrentServerTime() {
while (true) {
yield <html.input key="ONLY ME!" readOnly value={await $`time`.text()} />
await sleep(1_234)
}
}
const sleep = (time: number) => new Promise(resolve => setTimeout(resolve, time))
export function Demo() {
return (
<Suspense fallback="loading…">
<CurrentServerTime />
</Suspense>
)
}
@subtleGradient
Copy link
Author

https://x.com/shuding_/status/1770623199929078112?s=20
The AI SDK UI stream was implemented via nesting <Suspense> elements

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment