#web #asmjs #webasm #javascript

squark-stdweb

Squark 使用 stdweb 的网页浏览器运行时实现

6 个版本 (重大变更)

使用旧 Rust 2015

0.5.0 2018年4月10日
0.4.0 2018年4月9日
0.3.3 2018年4月3日
0.2.0 2018年4月2日
0.1.0 2018年3月29日

#8 in #asmjs

WTFPL 许可证

34KB
730 代码行

squark

crates.io docs.rs

受 HyperApp 启发的虚拟 DOM 实现和应用定义。

squark-macros

crates.io docs.rs

通过 proc_marcopest 解析器提供类似 JSX 宏的 Crate。

语法

view! {
    <button class="some-class" onclick={ |_| { Some(Action::Submit) }>
        Button!
    </button>
}

squark-stdweb

crates.io docs.rs

Squark 使用 stdweb 的网页浏览器运行时实现。

以下是一个计数器的完整示例!

#![feature(proc_macro)]

extern crate squark;
extern crate squark_macros;
extern crate squark_stdweb;
extern crate stdweb;

use stdweb::traits::*;
use stdweb::web::document;
use squark::{App, Runtime, View};
use squark_stdweb::StdwebRuntime;
use squark_macros::view;

#[derive(Clone, Debug, PartialEq)]
struct State {
    count: isize,
}

impl State {
    pub fn new() -> State {
        State { count: 0 }
    }
}

#[derive(Clone, Debug)]
enum Action {
    ChangeCount(isize),
}

#[derive(Clone, Debug)]
struct CounterApp;
impl App for CounterApp {
    type State = State;
    type Action = Action;

    fn reducer(mut state: State, action: Action) -> State {
        match action {
            Action::ChangeCount(c) => {
                state.count = c;
            }
        };
        state
    }

    fn view(state: State) -> View<Action> {
        let count = state.count.clone();
        view! {
            <div>
                { count.to_string() }
                <button onclick={ move |_| Some(Action::ChangeCount(count.clone() + 1)) }>
                    increment
                </button>
                <button onclick={ move |_| Some(Action::ChangeCount(count - 1)) }>
                    decrement
                </button>
            </div>
        }
    }
}

fn main() {
    stdweb::initialize();
    StdwebRuntime::<CounterApp>::new(
        document().query_selector("body").unwrap().unwrap(),
        State::new(),
    ).run();
    stdweb::event_loop();
}

项目目录位于 examples/counter

examples/todomvc 中也有 TodoMVC 示例,并且正在 https://rail44.github.io/squark/ 上工作。

依赖项

~4MB
~80K SLoC