3 ms·

> It's either VDOM or having to depend on a compiler to do everything (how Svelte works). Assuming you don't mean JSX transform by "compiler", you really don't

> It's either VDOM or having to depend on a compiler to do everything (how Svelte works). Assuming you don't mean JSX transform by "compiler", you really don't have to do either one. For my framework [1], state is directly bound to DOM elements. Dependencies are determined at run time. It's not slow. [1] https://mutraction.dev/ https://mutraction.dev/

rglover 2y ago
Dependencies meaning other components or something else? And if I understand correctly, you're forming relationships between parents/children by setting extra properties on the DOM nodes themselves (e.g., node.mutraction_parent = <Some Other DOM Node>)?
- recursive 2y ago
  No. Dependency means a state/data dependency that would require a UI update. You never need to explicitly assign tree relationships like parents. Here's the example code from the front page. In this case, `model.clicks` is a dependency. const model = track({ clicks: 0 }); const app = ( <button onclick={ () => ++model.clicks }> { model.clicks } clicks </button> ); document.body.append(app);
  - rglover 2y ago
    Gotcha. Interesting...how does it work? Sounds like a pretty novel way to solve the problem.
    - recursive 2y ago
      Essentially object proxies. When you invoke a property getter in tracked contexts (like DOM element construction), a dependency is registered for that object property. When you invoke the corresponding setter, the update function for the list of dependencies are notified. That's the idea, in a nutshell. I'm definitely not the first one to come up with this idea, but I hadn't found another UI framework that worked exactly like how I wanted. Solid is kind of close, but not it. Vue has some of this as well, but it's a bit more kitchen-sink in its scope.
      - rglover 2y ago
        Thanks for sharing, that's a cool idea. Will have to wrap my head around it a bit more but got me thinking about how to strip vdom.

rglover 2y ago

Dependencies meaning other components or something else? And if I understand correctly, you're forming relationships between parents/children by setting extra properties on the DOM nodes themselves (e.g., node.mutraction_parent = <Some Other DOM Node>)?

recursive 2y ago
No. Dependency means a state/data dependency that would require a UI update. You never need to explicitly assign tree relationships like parents. Here's the example code from the front page. In this case, `model.clicks` is a dependency. const model = track({ clicks: 0 }); const app = ( <button onclick={ () => ++model.clicks }> { model.clicks } clicks </button> ); document.body.append(app);
- rglover 2y ago
  Gotcha. Interesting...how does it work? Sounds like a pretty novel way to solve the problem.
  - recursive 2y ago
    Essentially object proxies. When you invoke a property getter in tracked contexts (like DOM element construction), a dependency is registered for that object property. When you invoke the corresponding setter, the update function for the list of dependencies are notified. That's the idea, in a nutshell. I'm definitely not the first one to come up with this idea, but I hadn't found another UI framework that worked exactly like how I wanted. Solid is kind of close, but not it. Vue has some of this as well, but it's a bit more kitchen-sink in its scope.
    - rglover 2y ago
      Thanks for sharing, that's a cool idea. Will have to wrap my head around it a bit more but got me thinking about how to strip vdom.