Documentation

Reactivity

Fyr tracks state changes and updates bindings in the DOM without a virtual-DOM layer.

State and computed values

State is reactive. Computed functions derive values from that state and update when their dependencies change.

Fyr.createApp("cart", {
  state: { quantity: 2, price: 12 },
  computed: {
    total() { return this.state.quantity * this.state.price; }
  }
});

For predictable updates, replace arrays when adding, removing, or filtering records.

this.state.tasks = [
  ...this.state.tasks,
  { id: crypto.randomUUID(), title: "Ship Fyr" }
];