ovr
A lightweight server framework built for streaming with asynchronous generator JSX.
Async Generator JSX
Create a stream of HTML with familiar JSX components, no client-side JS required.
Performance First
Evaluate components in parallel and stream them as they are generated.
Lightweight
Heavy on features, zero dependencies.
Type Safe
Type safe path parameters, components, and more.
Blazing Fast Routing
Code based routing that scales.
Web Standards
Built on the Fetch API, ovr runs everywhere.
Demo
Check out the demos to see ovr in action.
Introduction
Designed to optimize Time-To-First-Byte, ovr evaluates components in parallel and streams HTML in order by producing an AsyncGenerator
of HTML that feeds directly into the streamed response.
For the following component:
function Component() {
return <p>hello world</p>;
}
ovr generates three Chunk
s of HTML:
"<p>"; // streamed immediately
"hello world"; // next
"</p>"; // last
Asynchronous streaming
While this streaming is trivial for a paragraph, consider when a component is asynchronous:
async function Username() {
const user = await getUser(); // slow...
return <span>{user.name}</span>;
}
function Component() {
return (
<p>
hello <Username />
</p>
);
}
Instead of waiting for Username
to resolve before sending the entire Component
, ovr will send what it has immediately and stream the rest as it becomes available.
"<p>";
"hello ";
// streamed immediately
// for await (const chunk of Username()) { ...
"<span>";
"username";
"</span>";
"</p>";
Render how browsers read
Web browsers are built for streaming, they parse and paint HTML as it arrives. Most critically, the head of the document can be sent immediately to start the requests for linked assets (JavaScript, CSS, etc.) and start parsing before the HTML has finished streaming.
ovr’s architecture gives you streaming server-side rendering out of the box. No hydration bundle, no buffering—just HTML delivered in order, as soon as it’s ready.