10个版本 (破坏性更新)

0.8.0	2024年5月2日
0.7.1	2023年11月7日
0.6.0	2023年10月15日
0.5.0	2023年7月17日
0.1.1	2021年4月30日

#1336 in Web编程

每月97次下载
用于 3 个Crate

MIT/Apache

535KB
7.5K SLoC

Silkenweb

构建响应式Web应用程序的库。

特性

无VDOM。使用信号进行细粒度响应性，以最小化DOM API调用。
使用纯Rust语法而不是宏DSL。
通过CSS Modules进行CSS作用域。请参阅CSS Modules示例。
路由，适用于客户端或服务器。
Tauri支持
使用解冻的服务器端渲染，以及编译时预渲染。
使用Arpy的全栈应用程序。请参阅客户端-服务器示例。
htmx集成。请参阅htmx-axum示例。

示例：简单的计数器

use futures_signals::signal::{Mutable, SignalExt};
use silkenweb::{elements::html::*, prelude::*, value::Sig};

fn main() {
    let count = Mutable::new(0);
    let count_text = count.signal().map(|i| format!("{i}"));
    let inc = move |_, _| {
        count.replace_with(|i| *i + 1);
    };

    let app = div()
        .child(button().on_click(inc).text("+"))
        .child(p().text(Sig(count_text)));

    mount("app", app);
}

快速开始

rustup target add wasm32-unknown-unknown
cargo install --locked trunk
cd examples/counter
trunk serve --open

书籍

Silkenweb 书籍提供了对Silkenweb主要概念的概述。

与其他框架的比较

Sycamore和Leptos是另外两个基于信号的Rust框架。在撰写此比较时，它们都在快速发展，Silkenweb也是如此。同时请注意，我对Sycamore或Leptos不太熟悉。

Silkenweb尽可能使用纯、非宏Rust，并投入了大量努力使其易于使用。Sycamore和Leptos主要使用宏DSL来定义组件。我相信Sycamore还有一个构建器API。
生态系统：Leptos 和 Sycamore 分别有 cargo-leptos 和 Perseus，而 Silkenweb 目前还没有生态系统。
CSS 作用域：Silkenweb 支持 CSS Modules。请参考 CSS Modules 示例。CSS Modules 的支持与 SSR 和 Hydration 集成，因此只有渲染初始页面所需的 CSS 会从服务器发送，然后在客户端逐步增强。我并不清楚 Leptos 或 Sycamore 中是否有 CSS 作用域的支持。
服务器函数：Leptos 支持服务器函数，以无缝地将您的应用程序分为客户端和服务器。Silkenweb 直接不支持类似的功能，但可以通过 Arpy 提供类似的功能。
Sycamore 和 Leptos 都尽力使将信号克隆到闭包中变得更加便捷。Silkenweb 提供了一个 clone! 宏来使事情变得简单一些，但除此之外并没有解决这个问题。我不确定 Sycamore/Leptos 的方法有何权衡。它们是否使得清理派生信号变得更困难？它们是否意味着需要更复杂的生命周期注释？是否需要在任何地方传递上下文？
Silkenweb 支持使用第三方 Web 组件。我并不清楚 Sycamore 或 Leptos 是否支持。
Silkenweb 支持 shadow roots，包括与实验性的 Declarative Shadow DOM 一起的 Hydration 和 SSR 支持。它还提供了一个简单的 Component 包装器来管理插槽。同样，我不确定 Leptos 和 Sycamore 是否支持这一点。
Silkenweb 不直接使用任何不安全的 Rust。一些底层 Crates 确实使用了不安全代码，但至少您不必对我编写代码的技能有太多的信任！
所有这些框架都支持以下功能：
- 静态网站生成。
- 使用 SSR 和 Hydration 进行渐进式增强。

设计权衡

无 VDOM

基于信号的方法可以提供更好的性能，因为编译器可以在编译时知道应用程序中的数据依赖关系。这使得在运行时可以高效地计算更改。另一方面，基于基本 VDOM 的方法需要运行时识别更改。

基于信号的方法的缺点是代码通常更复杂。然而，在实际实现中，基于 VDOM 的方法通常实现了一些机制，以防止每次更改发生时都完全重新渲染 VDOM，这给使用 VDOM 方法的代码增加了一些复杂性。

无宏 DSL

使用纯 Rust 语法有诸多好处，例如

无需学习宏特定领域语言 (DSL)。
通过 rust-analyser 改进了代码补全。
得益于 rustdoc，文档结构熟悉。
使用 rustfmt 进行代码格式化。虽然宏DSL可以精心设计后使用 rustfmt 进行格式化，但其语法受限于 rustfmt 的功能。
来自 rustc 的优秀编译器错误：尽管宏DSL可以生成有信息量的错误，但已经投入了大量工作来使 rustc 的错误信息更加出色。
利用Rust的模块化和设计良好的抽象的能力。

虽然可以开发一个与Silkenweb一起工作的宏DSL，但Rust的语法已经非常适合定义文档结构。

silkenweb