Skip to content

sycamore-rs/sycamore

Repository files navigation

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!