#html #dom #web

sauron

An html library for building client side webapps

26 releases (13 breaking)

✓ Uses Rust 2018 edition

0.24.0 Apr 26, 2020
0.22.2 Mar 5, 2020
0.20.3 Dec 13, 2019
0.20.1 Nov 19, 2019
0.10.0 Jul 25, 2019

#8 in Template engine

Download history 19/week @ 2020-01-25 40/week @ 2020-02-01 33/week @ 2020-02-08 52/week @ 2020-02-15 257/week @ 2020-02-22 71/week @ 2020-02-29 61/week @ 2020-03-07 34/week @ 2020-03-14 81/week @ 2020-03-21 31/week @ 2020-03-28 61/week @ 2020-04-04 185/week @ 2020-04-11 33/week @ 2020-04-18 71/week @ 2020-04-25 13/week @ 2020-05-02 22/week @ 2020-05-09

334 downloads per month
Used in 3 crates (2 directly)

MIT license

170KB
4K SLoC

Rust 2.5K SLoC // 0.2% comments Ruby HTML 1.5K SLoC // 0.1% comments Shell 11 SLoC // 0.3% comments

sauron

Latest Version Build Status MIT licensed

sauron

One crate to rule the DOM

One crate to mind it

One crate to bring JSON

And in the Rust code bind it

This code, no other, is made by code elves

Who'd pawn parent process to get it themselves

Ruler of net troll and mortal and hacker

This code is a lib crate for Patreon backers

If trashed or buggy it cannot be remade

If found send to Ivan, the bandwidth is prepaid

-- The Harvard Lampoon & po8

Sauron is an html web framework for building web-apps with the goal of closely adhering to The Elm Architecture, a paragon for elegant design.

As with elm, sauron follows the simplistic design of writing view code.

Example

use sauron::prelude::*;
use wasm_bindgen::prelude::*;
use log::*;

#[derive(Debug, PartialEq, Clone)]
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> {
        div!(
            [class("some-class"), id("some-id"), attr("data-id", 1)],
            [
                input!(
                    [
                        class("client"),
                        type_("button"),
                        value("Click me!"),
                        onclick(|_| {
                            trace!("Button is clicked");
                            Msg::Click
                        }),
                    ],
                    [],
                ),
                text!("Clicked: {}", self.click_count),
            ],
        )
    }

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

}

#[wasm_bindgen(start)]
pub fn main() {
    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 src='pkg/minimal.js'></script>
    <script type=module>
        window.wasm_bindgen('pkg/minimal_bg.wasm')
            .catch(console.error);
    </script>
  </body>
</html>

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

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

Note: You need to use the nightly compiler with minimum version: rustc 1.37.0-nightly (17e62f77f 2019-07-01)

Build using

$> wasm-pack build --target no-modules

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

Demo examples

Convert html to sauron 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

Warning: I repeat, You need to use the latest nightly compiler in order for this to work.

Performance:

Benchmark

Please support this project:

Become a patron

License: MIT

Dependencies

~0.5–2.6MB
~53K SLoC