Out of order streaming support for Astro.
⚠️ This is little more than a proof of concept at this point. Use it if you dare, but know that I'm not (yet) using it in production myself.
npx astro add astro-suspense
---
import { Suspense } from "astro-suspense/components";
import SlowComponent from "./SlowComponent.astro";
---
<Suspense>
<p slot="fallback">Loading...</p>
<p slot="error">Something went wrong</p>
<SlowComponent />
</Suspense>
For view transitions you need to replace Astro's default <ViewTransitions />
with this package's <SuspenseViewTransitions />
.
---
import { SuspenseViewTransitions } from "astro-suspense/components";
---
<!doctype html>
<html>
<head>
<SuspenseViewTransitions />
</head>
<body> </body>
</html>