wip: remove runner on hook and then update docs
This commit is contained in:
1 parent
7d41a16208
commit
d1560450ba
95 files changed
+1339
-675
No files matched your search
+72
-9
@@ -1,24 +1,87 @@
|
||||
# Dioxus SSR
|
||||
<div align="center">
|
||||
<h1>Dioxus Server-Side Rendering (SSR)</h1>
|
||||
<p>
|
||||
<strong>Render Dioxus to valid html.</strong>
|
||||
</p>
|
||||
</div>
|
||||
|
||||
Render a Dioxus VirtualDOM to a string.
|
||||
## Resources
|
||||
This crate is a part of the broader Dioxus ecosystem. For more resources about Dioxus, check out:
|
||||
|
||||
- [Getting Started](https://dioxuslabs.com/getting-started)
|
||||
- [Book](https://dioxuslabs.com/book)
|
||||
- [Reference](https://dioxuslabs.com/reference)
|
||||
- [Community Examples](https://github.com/DioxusLabs/community-examples)
|
||||
|
||||
## Overview
|
||||
|
||||
Dioxus SSR provides utilities to render Dioxus components to valid HTML. Once rendered, the HTML can be rehydrated client side or served from your web-server of choice.
|
||||
|
||||
```rust
|
||||
// Our app:
|
||||
const App: Component = |cx| rsx!(cx, div {"hello world!"});
|
||||
let app: Component = |cx| cx.render(rsx!(div {"hello world!"}));
|
||||
|
||||
// Build the virtualdom from our app
|
||||
let mut vdom = VirtualDOM::new(App);
|
||||
|
||||
// This runs components, lifecycles, etc. without needing a physical dom. Some features (like noderef) won't work.
|
||||
let mut vdom = VirtualDom::new(app);
|
||||
let _ = vdom.rebuild();
|
||||
|
||||
// Render the entire virtualdom from the root
|
||||
let text = dioxus::ssr::render_vdom(&vdom);
|
||||
assert_eq!(text, "<div>hello world!</div>")
|
||||
```
|
||||
|
||||
|
||||
## Basic Usage
|
||||
|
||||
The simplest example is to simply render some `rsx!` nodes to html. This can be done with the [`render_lazy`] api.
|
||||
|
||||
```rust
|
||||
let content = dioxus::ssr::render(rsx!{
|
||||
div {
|
||||
(0..5).map(|i| rsx!(
|
||||
"Number: {i}"
|
||||
))
|
||||
}
|
||||
});
|
||||
```
|
||||
|
||||
## Rendering a VirtualDom
|
||||
|
||||
```rust
|
||||
let mut dom = VirtualDom::new(app);
|
||||
let _ = dom.rebuild();
|
||||
|
||||
let content = dioxus::ssr::render_vdom(&dom);
|
||||
```
|
||||
|
||||
## Configuring output
|
||||
It's possible to configure the output of the generated HTML.
|
||||
|
||||
```rust
|
||||
let content = dioxus::ssr::render_vdom(&dom, |config| config.pretty(true).prerender(true));
|
||||
```
|
||||
|
||||
## Usage as a writer
|
||||
|
||||
We provide the basic `SsrFormatter` object that implements `Display`, so you can integrate SSR into an existing string, or write directly to a file.
|
||||
|
||||
```rust
|
||||
use std::fmt::{Error, Write};
|
||||
|
||||
let mut buf = String::new();
|
||||
|
||||
let dom = VirtualDom::new(app);
|
||||
let _ = dom.rebuild();
|
||||
|
||||
let args = dioxus::ssr::formatter(dom, |config| config);
|
||||
buf.write_fmt!(format_args!("{}", args));
|
||||
```
|
||||
|
||||
## Configuration
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
## Usage in pre-rendering
|
||||
|
||||
This crate is particularly useful in pre-generating pages server-side and then selectively loading dioxus client-side to pick up the reactive elements.
|
||||
|
||||
+6
-16
@@ -1,14 +1,4 @@
|
||||
//!
|
||||
//!
|
||||
//!
|
||||
//!
|
||||
//! This crate demonstrates how to implement a custom renderer for Dioxus VNodes via the `TextRenderer` renderer.
|
||||
//! The `TextRenderer` consumes a Dioxus Virtual DOM, progresses its event queue, and renders the VNodes to a String.
|
||||
//!
|
||||
//! While `VNode` supports "to_string" directly, it renders child components as the RSX! macro tokens. For custom components,
|
||||
//! an external renderer is needed to progress the component lifecycles. The `TextRenderer` shows how to use the Virtual DOM
|
||||
//! API to progress these lifecycle events to generate a fully-mounted Virtual DOM instance which can be renderer in the
|
||||
//! `render` method.
|
||||
#![doc = include_str!("../README.md")]
|
||||
|
||||
use std::fmt::{Display, Formatter};
|
||||
|
||||
@@ -17,7 +7,6 @@ use dioxus_core::exports::bumpalo::Bump;
|
||||
use dioxus_core::IntoVNode;
|
||||
use dioxus_core::*;
|
||||
|
||||
/// A memory pool for rendering
|
||||
pub struct SsrRenderer {
|
||||
inner: bumpalo::Bump,
|
||||
cfg: SsrConfig,
|
||||
@@ -34,6 +23,7 @@ impl SsrRenderer {
|
||||
pub fn render_lazy<'a>(&'a mut self, f: LazyNodes<'a, '_>) -> String {
|
||||
let bump = &mut self.inner as *mut _;
|
||||
let s = self.render_inner(f);
|
||||
|
||||
// reuse the bump's memory
|
||||
unsafe { (&mut *bump as &mut bumpalo::Bump).reset() };
|
||||
s
|
||||
@@ -63,13 +53,12 @@ pub fn render_lazy<'a>(f: LazyNodes<'a, '_>) -> String {
|
||||
// regular component usage. The <'a> lifetime is used to enforce that all calls of IntoVnode use the same allocator.
|
||||
//
|
||||
// When LazyNodes are provided, they are FnOnce, but do not come with a allocator selected to borrow from. The <'a>
|
||||
// lifetime is therefore longer than the lifetime of the allocator which doesn't exist yet.
|
||||
// lifetime is therefore longer than the lifetime of the allocator which doesn't exist... yet.
|
||||
//
|
||||
// Therefore, we cast our local bump alloactor into right lifetime. This is okay because our usage of the bump arena
|
||||
// is *definitely* shorter than the <'a> lifetime, and we return owned data - not borrowed data.
|
||||
// Therefore, we know that no references are leaking.
|
||||
let _b: &'a Bump = unsafe { std::mem::transmute(borrowed) };
|
||||
// is *definitely* shorter than the <'a> lifetime, and we return *owned* data - not borrowed data.
|
||||
|
||||
let _b = unsafe { std::mem::transmute::<&Bump, &'a Bump>(borrowed) };
|
||||
let root = f.into_vnode(NodeFactory::new(_b));
|
||||
|
||||
format!(
|
||||
@@ -85,6 +74,7 @@ pub fn render_lazy<'a>(f: LazyNodes<'a, '_>) -> String {
|
||||
pub fn render_vdom(dom: &VirtualDom) -> String {
|
||||
format!("{:}", TextRenderer::from_vdom(dom, SsrConfig::default()))
|
||||
}
|
||||
|
||||
pub fn render_vdom_cfg(dom: &VirtualDom, cfg: impl FnOnce(SsrConfig) -> SsrConfig) -> String {
|
||||
format!(
|
||||
"{:}",
|
||||
|
||||
Reference in new issue
Block a user