16 releases (8 breaking)

0.40.0 Aug 15, 2021
0.38.0 Aug 9, 2021
0.34.0 Jan 15, 2021
0.33.0 Nov 27, 2020
0.1.4 Jul 21, 2020

#403 in Web programming

Download history 16/week @ 2021-06-05 6/week @ 2021-06-12 5/week @ 2021-06-19 8/week @ 2021-06-26 10/week @ 2021-07-03 7/week @ 2021-07-10 21/week @ 2021-07-17 19/week @ 2021-07-24 78/week @ 2021-07-31 76/week @ 2021-08-07 288/week @ 2021-08-14 53/week @ 2021-08-21 21/week @ 2021-08-28 16/week @ 2021-09-04 32/week @ 2021-09-11 39/week @ 2021-09-18

100 downloads per month
Used in 2 crates

MIT license

180KB
4.5K SLoC

Maintenance

sauron

Latest Version Build Status MIT licensed

sauron

Guide

Sauron is a versatile web framework and library for building client-side and/or server-side web applications with strong focus on simplicity. It is suited for developing web application which uses progressive rendering.

Example

use log::trace;
use sauron::html::attributes::attr;
use sauron::html::text;
use sauron::prelude::*;
use sauron::{Cmd, Component, Node, Program};

#[derive(Debug)]
pub enum Msg {
    Click,
}

pub struct App {
    click_count: u32,
}

impl App {
    pub fn new() -> Self {
        App { click_count: 0 }
    }
}

impl Component<Msg> for App {
    fn view(&self) -> Node<Msg> {
        node! {
            <main>
                <h1>"Minimal example"</h1>
                <div class="some-class" id="some-id" {attr("data-id", 1)}>
                    <input class="client"
                            type="button"
                            value="Click me!"
                            key=1
                            on_click={|_| {
                                trace!("Button is clicked");
                                Msg::Click
                            }}
                    />
                    <div>{text(format!("Clicked: {}", self.click_count))}</div>
                    <input type="text" value={self.click_count}/>
                </div>
            </main>
        }
    }

    fn update(&mut self, msg: Msg) -> Cmd<Self, Msg> {
        trace!("App is updating with msg: {:?}", msg);
        match msg {
            Msg::Click => self.click_count += 1,
        }
        Cmd::none()
    }
}

#[wasm_bindgen(start)]
pub fn main() {
    console_log::init_with_level(log::Level::Trace).unwrap();
    console_error_panic_hook::set_once();
    Program::mount_to_body(App::new());
}

index.html

<html>
  <head>
    <meta content="text/html;charset=utf-8" http-equiv="Content-Type"/>
    <title>Minimal sauron app</title>
  </head>
  <body>
    <script type=module>
        import init from './pkg/minimal.js';
        init().catch(console.error);
    </script>
  </body>
</html>

In Cargo.toml, specify the crate-type to be cdylib


[package]
name = "minimal"
version = "0.1.0"
edition = "2018"

[lib]
crate-type = ["cdylib"]


[dependencies]
sauron = "0.39"
console_error_panic_hook = "0.1"
log = "0.4"
console_log = "0.2"

Build using

$> wasm-pack build --target web --release

Look at the examples and the build script for the details.

Demo examples

  • todomvc The todomvc example
  • futuristic-ui - A demo of futuristic-ui showcasing animation, transition and timed Component update.
  • data-viewer - A resizable spreadsheet CSV data viewer
  • svg-clock - A clock drawn using SVG and window tick event.
  • svg-graph - A simple graph using SVG
  • ultron code-editor - A web-base text-editor with syntax highlighting

Converting HTML into Sauron's syntax

html2sauron - A tool to easily convert html into sauron node tree for your views.

Prerequisite:

cargo install wasm-pack
cargo install basic-http-server

Performance:

Sauron is one of the fastest.

Benchmark Benchmark

Run the benchmark yourself:

Benchmark 1 Benchmark 2

Please support this project:

Become a patron

License: MIT

Dependencies

~2.5–3.5MB
~74K SLoC