apprun-wasm: A Rust repository from yysun

AppRun Virtual DOM Rust

This is the Virtual DOM of AppRun ported to WebAssembly using Rust.

To use this template, you need the Rust tool chain, and wasm-pack installed first.

This project is currently being worked on and is not ready for use!!!

To developers

In JavaScript/TypeScript

let mod;
import('../pkg').then(m => mod = m).catch(e => console.log(e));

const vdom = [...];
mod.render(document.getElementById('p'), vdom);

References

Virtual DOM

The virtual DOM is an array that contains number, string, object, html element, svg element, and virtual node.

The virtual node is an object that has three properties: tag, props and children.

[
  'hi',
  100,
  { a: 100 }
  document.createElement('h1'),
  {
    tag: 'div',
    props: { id: '1' },
    children: [{
      tag: 'button',
      props: { onclick: () => { }}
    }]
  },
])

Virtual DOM Rendering

The render function renders the virtual DOM to an element or document.body.

In Rust

#[wasm_bindgen]
pub fn render(element: &Element, vdom: Vec<JsValue>, is_svg: &JsValue) {
  ......
}