Yew Framework - API Documentation

Yew is a modern Rust framework for creating multi-threaded front-end web apps using WebAssembly

• Features a macro for declaring interactive HTML with Rust expressions. Developers who have experience using JSX in React should feel quite at home when using Yew.
• Achieves high performance by minimizing DOM API calls for each page render and by making it easy to offload processing to background web workers.
• Supports JavaScript interoperability, allowing developers to leverage NPM packages and integrate with existing JavaScript applications.

Supported Targets

• wasm32-unknown-unknown

Important Notes

• Yew is not (yet) production ready but is great for side projects and internal tools

Example

use yew::prelude::*;

enum Msg {
    AddOne,
}

struct Model {
    link: ComponentLink<Self>,
    value: i64,
}

impl Component for Model {
    type Message = Msg;
    type Properties = ();

    fn create(_props: Self::Properties, link: ComponentLink<Self>) -> Self {
        Self {
            link,
            value: 0,
        }
    }

    fn update(&mut self, msg: Self::Message) -> ShouldRender {
        match msg {
            Msg::AddOne => {
                self.value += 1;
                true
            }
        }
    }

    fn change(&mut self, _props: Self::Properties) -> ShouldRender {
        false
    }

    fn view(&self) -> Html {
        html! {
            <div>
                <button onclick=self.link.callback(|_| Msg::AddOne)>{ "+1" }</button>
                <p>{ self.value }</p>
            </div>
        }
    }
}

# fn dont_execute() {
fn main() {
    yew::start_app::<Model>();
}
# }