Add binding

[nixonyh]

Unlike a reactive (which allows you to mutate an entire subtree), a binding allows you to only mutate a single element.

The example now uses binding instead of reactive to reduce unnecessary computation.

[coderabbitai]

Caution

Review failed

The pull request is closed.

ℹ️ Recent review info

⚙️ Run configuration

Configuration used: Organization UI

Review profile: CHILL

Plan: Pro Plus

Run ID: 639ace85-62c7-4d35-b260-7e10b7419621

📥 Commits

Reviewing files that changed from the base of the PR and between 7649ada and 98f0249.

📒 Files selected for processing (9)

• crates/fynix/src/binding.rs
• crates/fynix/src/composer.rs
• crates/fynix/src/ctx.rs
• crates/fynix/src/element/storage.rs
• crates/fynix/src/interaction.rs
• crates/fynix/src/lib.rs
• crates/fynix/src/reactive.rs
• examples/vello_winit_examples/examples/hello_world.rs
• examples/vello_winit_examples/src/lib.rs

---

📝 Walkthrough

Summary by CodeRabbit

Release Notes

• New Features

  • Added field binding system enabling reactive data synchronization to UI elements.

• Bug Fixes

  • Fixed window resize handling to trigger immediate re-render instead of waiting for next redraw cycle.

• Refactor

  • Enhanced type safety throughout element creation and composer APIs for better API clarity.

Walkthrough

Introduces a typed ElementHandle<E> wrapper over ElementId, a new Binding<W> system for world-to-element field propagation via type-erased function pointers, and a ElementCtx<'f, W, E> fluent build context returned by all FynixCtx element creation methods. Updates Composer<W> to return typed handles, wires bindings into Fynix<W> lifecycle, and migrates the hello_world example to use bindings instead of reactives.

Changes

Typed Handle, Binding System, and Fluent Builder

Layer / File(s)	Summary
ElementHandle typed wrapper in element storage crates/fynix/src/element/storage.rs	Introduces ElementHandle<E: Element> as a Copy-able PhantomData-tagged wrapper over ElementId; Elements::add and Elements::add_with_id now return ElementHandle<E> instead of ElementId.
Binding system: type-erased field propagation crates/fynix/src/binding.rs	Adds the entire binding module: Bindings<W> store, Binding<W> with changed_fn/apply_fn, GetFnPtr using transmute-based type erasure, the monomorphized internal apply<W,E,T> writer, BindingId, and ChangedFn/ApplyFn/GetFn type aliases.
Composer<W> typed return, reactive rename, Fynix wiring crates/fynix/src/composer.rs, crates/fynix/src/reactive.rs, crates/fynix/src/lib.rs	Composer<W> gains type Element: Element and compose returns ElementHandle<Self::Element>. Reactives::by_element is renamed to element_map. Fynix<W> adds a bindings: Bindings<W> field, initialized in new, cleaned up in remove_element, and applied in update_reactives.
ElementCtx fluent build context and updated FynixCtx builders crates/fynix/src/ctx.rs, crates/fynix/src/interaction.rs	Introduces ElementCtx<'f, W, E> returned by all FynixCtx creation methods (add, add_with, compose, compose_with, reactive). Adds bind(...), on(...), handle(), and id() methods with From conversions. Interaction doc comments updated to reference ElementCtx::on.
hello_world example migrated to bind-based updates examples/vello_winit_examples/examples/hello_world.rs, examples/vello_winit_examples/src/lib.rs	FPS label and window-size elements switch from ctx.reactive subtree rebuilding to bind-based field updates. TextButton::Composer adds type Element = Button and returns ElementHandle. Resize events now call render() immediately.

Sequence Diagram(s)

sequenceDiagram
  rect rgba(100, 149, 237, 0.5)
    Note over Caller,FynixCtx: Build phase
    Caller->>FynixCtx: add~Label~() / compose~TextButton~()
    FynixCtx-->>Caller: ElementCtx~'f, W, E~
    Caller->>ElementCtx: bind(fps_changed, get_fps, set_text)
    ElementCtx->>Bindings: add(Binding~W~)
  end
  rect rgba(144, 238, 144, 0.5)
    Note over Fynix,Elements: Frame update phase
    Fynix->>Bindings: snapshot_changed(world)
    Bindings-->>Fynix: Vec~Binding~W~~
    loop each changed binding
      Fynix->>Binding: apply(elements, world)
      Binding->>Elements: get_typed_mut~E~(id)
      Binding->>Elements: mark_dirty(id)
    end
  end

Loading

Estimated code review effort

🎯 4 (Complex) | ⏱️ ~60 minutes

Possibly related PRs

• voxell-tech/fynix#32: Modifies the same Composer<W> abstraction and FynixCtx composer-related APIs that this PR extends with typed ElementHandle/ElementCtx returns.
• voxell-tech/fynix#37: Touches the same Elements::add path in element/storage.rs that this PR refactors to return ElementHandle<E>.
• voxell-tech/fynix#41: Established the reactive rebuild loop in Fynix::update_reactives that this PR extends with the binding snapshot/apply pass.

Suggested reviewers

• ian-hon
• Sheerwin02

Poem

🐇 Hop, hop through the type-safe land,
Where ElementHandle fits just right in hand.
Bindings snap and fields align,
transmute whispers, "trust the design!"
No more reactive rebuild fuss—
bind the world and leave it to us! ✨

✨ Finishing Touches

📝 Generate docstrings

• Create stacked PR
• Commit on current branch

---

Thanks for using CodeRabbit! It's free for OSS, and your support helps us grow. If you like it, consider giving us a shout-out.

❤️ Share

• X
• Mastodon
• Reddit
• LinkedIn

_{Comment @coderabbitai help to get the list of available commands and usage tips.}