https://github.com/vertigo-web/vertigo
Reactive WebAssembly
https://github.com/vertigo-web/vertigo
rust wasm webassembly
Last synced: 3 months ago
JSON representation
Reactive WebAssembly
- Host: GitHub
- URL: https://github.com/vertigo-web/vertigo
- Owner: vertigo-web
- License: apache-2.0
- Created: 2020-07-20T20:53:07.000Z (almost 6 years ago)
- Default Branch: master
- Last Pushed: 2026-04-05T18:58:53.000Z (3 months ago)
- Last Synced: 2026-04-05T19:21:09.701Z (3 months ago)
- Topics: rust, wasm, webassembly
- Language: Rust
- Homepage:
- Size: 3.23 MB
- Stars: 27
- Watchers: 3
- Forks: 3
- Open Issues: 13
-
Metadata Files:
- Readme: README.md
- Changelog: CHANGES.md
- License: LICENSE-APACHE
Awesome Lists containing this project
README
# Vertigo
A reactive Real-DOM library with SSR for Rust.
[](https://crates.io/crates/vertigo)
[](https://docs.rs/vertigo)
[](https://deps.rs/crate/vertigo/0.11.2)
[](https://github.com/vertigo-web/vertigo/actions/workflows/pipeline.yaml)
[](https://crates.io/crates/vertigo)
## Features
* **Reactive dependencies** - A graph of values and clients (micro-subscriptions) that can automatically compute what to refresh after one value changes
* **Real DOM** - No intermediate Virtual DOM mechanism is necessary
* **HTML/CSS macros** - Allows to construct Real DOM nodes using HTML and CSS
* **Tailwind v4** support out of the box
* **Isomorphic server-side rendering** - The same WASM code is used for both client and server (see: [vertigo-cli](https://crates.io/crates/vertigo-cli))
* **Fullstack** - Can be mounted into actix-web (see: [vertigo-cli](https://crates.io/crates/vertigo-cli))
See [Changelog](https://github.com/vertigo-web/vertigo/blob/master/CHANGES.md) for recent features.
Go to **[TUTORIAL](https://github.com/vertigo-web/vertigo/blob/master/tutorial.md)** if you want to try.
For more information go to vertigo home website **[vertigo.znoj.pl](https://vertigo.znoj.pl/)**.
## Examples
Dependencies:
```toml
vertigo = "0.11"
```
Example 1:
```rust
use vertigo::{dom, DomNode, Value, bind, main};
#[main]
pub fn app() -> DomNode {
let count = Value::new(0);
let increment = bind!(count, |_| {
count.change(|value| {
*value += 1;
});
});
let decrement = bind!(count, |_| {
count.change(|value| {
*value -= 1;
});
});
dom! {
"Counter: " { count }
"-"
"+"
}
}
```
Example 2:
```rust
use vertigo::{css, component, DomNode, store, Value, dom, main};
#[component]
pub fn MyMessage(message: Value) {
dom! {
"Message to the world: "
{ message }
}
}
#[store]
fn state_message() -> Value {
Value::new("Hello world!".to_string())
}
#[main]
fn app() -> DomNode {
let main_div = css! {"
color: darkblue;
"};
dom! {
}
}
```
Take a look at **[More examples here](https://github.com/vertigo-web/vertigo/tree/master/examples)**.
## Installation of `vertigo-cli` tool
To ease process or development use
[vertigo-cli](https://github.com/vertigo-web/vertigo/blob/master/crates/vertigo-cli) tool
that allows to _build_, _serve_ and _watch_ your project.
```sh
cargo install --force vertigo-cli
```
## Demo App
### Prepare
Install cargo-make and vertigo-cli:
* `cargo install cargo-make vertigo-cli`
### Run
Build and run project using:
* `cargo make demo`
Eventually terminal will let you know that app is available under `http://localhost:4444/`
If you want to play around with the demo code, run:
* `cargo make demo-watch`
It should automatically recompile upon changes and the browser tab should be informed to refresh.
Note that this compiles the code in debug mode so the WASM is not optimized.
--------------
To run the examples in watch mode (they will run on localhost:4444):
`cargo make examples-counter` or `cargo make examples-router` or `cargo make examples-trafficlights`
## A community, soon to grow
* Discord server: