15 个版本

0.1.14	2024 年 2 月 15 日
0.1.13	2024 年 2 月 15 日
0.1.11	2023 年 10 月 1 日
0.1.9	2023 年 9 月 20 日

#192 在 HTTP 服务器中

51 每月下载量
在 2 crate 中使用

MIT 许可证

19KB
389 行

RSCx - Rust 服务器组件

RSCx 是一个具有良好开发者体验和出色性能的 RSCx 服务器端 HTML 渲染引擎库。

功能

所有组件都是异步函数
使用 rstml 解析的类似 JSX 的语法 RSX
上下文，以便轻松将值传递到组件树中 (示例)
受 Maud 和 Leptos 启发

⚠️ 警告：目前尚未准备好用于生产。它缺少一些重要功能，如 HTML 转义！

用法

所有示例均可在 rscx/examples/ 中找到。

use rscx::{component, html, props, CollectFragment};

#[tokio::main]
async fn main() -> Result<(), Box<dyn std::error::Error>> {
    let app = app().await;
    println!("{}", app);
    Ok(())
}

// simple function returning a String
// it will call the Items() function
async fn app() -> String {
    let s = "ul { color: red; }";
    html! {
        <!DOCTYPE html>
        <html>
            <head>
                <style>{s}</style>
            </head>
            <body>
                // call a component with no props
                <Section />

                // call a component with props and children
                <Section title="Hello">
                    <Items />
                </Section>
            </body>
        </html>
    }
}

#[component]
/// mark functions with #[component] to use them as components inside html! macro
fn Section(
    // you can use `builder` attributes to specify a default value (makes this prop optional)
    #[builder(default = "Default title".into(), setter(into))] title: String,
    #[builder(default)] children: String,
) -> String {
    html! {
        <div>
            <h1>{ title }</h1>
            { children }
        </div>
    }
}

#[component]
async fn Items() -> String {
    let data = load_data_async().await;
    html! {
        <ul>
            {
                data
                    .into_iter()
                    .map(|item| html! { <li>{ item }</li> })
                    .collect_fragment() // helper method to collect a list of components into a String
            }
        </ul>
    }
}

/// async functions can be easily used in the body of a component, as every component is an async
/// function
async fn load_data_async() -> Vec<String> {
    vec!["a".to_string(), "b".to_string(), "c".to_string()]
}

基准测试

RSCx 很快。

免责声明：如名称所示，RSCx 是为服务器设计的。因此，以下与 Leptos 的比较是不公平的。此库只包含 Leptos 特性的一小部分。

免责声明 2：基准测试非常基础，不应影响您是否决定使用此库的决定。关注 DX。它们被包含在内，因为我一直在运行它们，以确保我不会落后于其他替代方案太多。

中间的时间是平均值。

在本地运行基准测试

cd bench
# cargo install criterion
cargo criterion

基准测试 1：单个元素，许多 HTML 属性

many_attrs/maud_many_attrs
                        time:   [205.89 ns 208.35 ns 211.53 ns]
many_attrs/horrorshow_many_attrs
                        time:   [37.221 µs 37.304 µs 37.401 µs]
many_attrs/html_node_many_attrs
                        time:   [67.726 µs 67.830 µs 67.939 µs]
many_attrs/leptos_many_attrs
                        time:   [923.31 ns 928.46 ns 935.04 ns]
many_attrs/rscx_many_attrs
                        time:   [207.96 ns 212.82 ns 219.28 ns]

RSCx 和 Maud 几乎相同，因为它们的宏输出实际上是一个静态字符串，具有结果。

基准测试 2：带有 props 和子元素的微小元素

small_fragment/maud_small_fragment
                        time:   [107.60 ns 107.71 ns 107.81 ns]
small_fragment/horrorshow_small_fragment
                        time:   [405.98 ns 406.08 ns 406.21 ns]
small_fragment/leptos_small_fragment
                        time:   [1.7641 µs 1.7652 µs 1.7662 µs]
small_fragment/rscx_small_fragment
                        time:   [101.79 ns 101.87 ns 101.97 ns]

RSCx 提供了比 Maud 更好的 DX，因为语法更简洁，可以将 i32 等值作为 props/attributes 传递，而在 Maud 中每个属性都必须是静态字符串。

基准测试 3：动态属性（读取为变量）

many_dyn_attrs/horrorshow_many_dyn_attrs
                        time:   [50.445 µs 50.702 µs 50.977 µs]
many_dyn_attrs/leptos_many_dyn_attrs
                        time:   [100.13 µs 100.52 µs 101.00 µs]
many_dyn_attrs/rscx_many_dyn_attrs
                        time:   [33.953 µs 33.990 µs 34.037 µs]

基准测试 4：异步组件渲染 100 项列表

async_list/maud_async_list
                        time:   [2.3114 µs 2.3241 µs 2.3377 µs]
async_list/leptos_async_list
                        time:   [55.149 µs 55.228 µs 55.315 µs]
async_list/rscx_async_list
                        time:   [5.4809 µs 5.4987 µs 5.5151 µs]

我将继续重申免责声明：Leptos 并非专门为 SSR 设计。通过其响应式系统（使用异步资源）会增加开销。

依赖项

~4–12MB
~120K SLoC