21 releases

0.9.1 Nov 17, 2024
0.9.0-beta.4 Sep 16, 2024
0.9.0-beta.2 Oct 6, 2023
0.9.0-beta.1 Mar 26, 2023
0.6.3 Oct 10, 2021

#658 in WebAssembly

Download history 364/week @ 2024-08-24 522/week @ 2024-08-31 449/week @ 2024-09-07 486/week @ 2024-09-14 399/week @ 2024-09-21 568/week @ 2024-09-28 171/week @ 2024-10-05 233/week @ 2024-10-12 220/week @ 2024-10-19 364/week @ 2024-10-26 404/week @ 2024-11-02 99/week @ 2024-11-09 461/week @ 2024-11-16 387/week @ 2024-11-23 1047/week @ 2024-11-30 847/week @ 2024-12-07

2,762 downloads per month
Used in 29 crates (4 directly)

MIT license

115KB
2K SLoC

Sycamore

Crates.io docs.rs GitHub contributors Discord

Sycamore is a reactive library for creating web apps in Rust and WebAssembly.

#[component]
fn Hello() -> View {
    view! {
        p { "Hello World!" }
    }
}
  • Lightning Speed: Sycamore harnesses the full power of Rust via WebAssembly, giving you full control over performance.
  • Ergonomic and Intuitive: Write code that feels natural. Everything is built on reactive primitives without a cumbersome virtual DOM.
  • No JavaScript: Had enough of JavaScript? So have we. Create apps using Sycamore without touching a single line of JS.

Documentation

Sycamore is extensively documented:

  • The Book: The Sycamore "Book" will first help guide you through basic concepts and create a simple app. It then dwelves into some more advanced topics for building more complex apps.
  • API Documentation: the rustdocs for the sycamore crate.

Still have questions? Don't hesitate to stop by our friendly Discord server.

Examples

Sycamore has many examples for your reference in the examples/ directory. Be sure to check them out!

Viewing on examples.sycamore.dev

All the examples are hosted under examples.sycamore.dev/<example_name> with <example_name> being the name of the example you want to view. For instance, the todomvc example is hosted on examples.sycamore.dev/todomvc.

Building Locally

All the examples can also be built locally using Trunk. For instance, the following command builds and serves the todomvc example:

cd examples/todomvc
trunk serve

Now open up http://localhost:8080 in your browser to see the example running in action.

Alternatives?

Don't think Sycamore is for you? Thankfully, there are plenty of alternatives!

  • SolidJS: A declarative, efficient and flexible JavaScript library for building user interfaces
    Solid is a JavaScript library which greatly inspired Sycamore. Many concepts such as fine-grained reactivity and components as factory functions were borrowed from Solid. If you don't mind working with JavaScript (or TypeScript), go check it out!
  • Leptos: Build fast web applications with Rust.
    Leptos is another Rust library based on the fine-grained reactivity paradigm. Leptos shares many similarities with Sycamore and, as of now, has a larger community.
  • Dioxus: Fullstack app framework for web, desktop, mobile, and more.
    Dioxus uses a VDOM instead of fine-grained reactivity for updating the DOM, although it uses fine-grained reactivity for state management. This allows Dioxus to target a wide variety of platforms including native and mobile.

Contributing

Sycamore would not have been possible without the wonderful contributions from the community. Thank you!

Special thanks to @nate-sys for designing the Sycamore logo!

Dependencies

~315–630KB
~12K SLoC