3 ms·

The blogpost in the first link doesn't mention Preact at all. Preact is mostly API-compatible with React, and it having a different underlying model is an extr

by sesm 2y ago

The blogpost in the first link doesn't mention Preact at all. Preact is mostly API-compatible with React, and it having a different underlying model is an extraordinary claim that requires extraordinary evidence. I've read the docs on Preact signals, and they look like React refs, but put outside of components. edit: the last paragraph about refs

CharlieDigital 2y ago
> ...a different underlying model is an extraordinary claim that requires extraordinary evidence You are looking at the syntax and not the reactivity model (how it determines what functions to call when a change happens). The post doesn't need to mention Preact because every other framework is signals-based except for React. Vue is simply the stand-in for "signals-based reactivity". Vue has different syntax from Preact (though it, too, can also use JSX), but it has the same reactivity principle. https://preactjs.com/guide/v10/signals/ https://preactjs.com/guide/v10/signals/ > What makes Signals unique is that state changes automatically update components and UI in the most efficient way possible. Automatic state binding and dependency tracking allows Signals to provide excellent ergonomics and productivity while eliminating the most common state management footguns. It uses the same underlying reactivity model as Vue, Svelte, Solid, and Qwik. Vue docs: https://vuejs.org/guide/extras/reactivity-in-depth.html#connection-to-signals https://vuejs.org/guide/extras/reactivity-in-depth.html#conn... Solid docs: https://www.solidjs.com/docs/latest/api#createsignal https://www.solidjs.com/docs/latest/api#createsignal Svelte: https://svelte.dev/blog/runes#Signal-boost https://svelte.dev/blog/runes#Signal-boost Qwik docs: https://qwik.dev/docs/components/state/#usesignal https://qwik.dev/docs/components/state/#usesignal In the blog post, Vue is the stand-in for signals-based reactivity. All signals-based reactivity models work the same way at a high level (their difference being primarily in their low-level DOM diff and update). My prediction is that even React will eventually end up signals based because of TC39 Signals: https://github.com/tc39/proposal-signals https://github.com/tc39/proposal-signals
- sesm 2y ago
  Preact is not signals-based, it uses the React model with state and props as the basic model, but also provides Signals as a parallel model.
  - CharlieDigital 2y ago
    I guess that's like arguing a Prius Prime isn't electric because even though it has a battery and can drive all electric, it also has a gas engine. :shrug: But very clearly, Preact has the option of the exact same reactivity primitive and design as Vue, Solid, Qwik, and Svelte https://preactjs.com/guide/v10/signals/ https://preactjs.com/guide/v10/signals/ > In Preact, when a signal is passed down through a tree as props or context, we're only passing around references to the signal. The signal can be updated without re-rendering any components, since components see the signal and not its value. This lets us skip all of the expensive rendering work and jump immediately to any components in the tree that actually access the signal's .value property.
    - sesm 2y ago
      I'll accept an analogy with a hybrid car. In this analogy, Preact would be a gas car with an additional electric engine bolted on as an afterthought.
      - CharlieDigital 2y ago
        But you know, the Prius Prime is a PHEV as in "plug in hybrid electric vehicle"
        sesm 2y ago
        Oh, I see what you mean now! This sounds like a very good analogy.

by sesm 2y ago

CharlieDigital 2y ago

> ...a different underlying model is an extraordinary claim that requires extraordinary evidence You are looking at the syntax and not the reactivity model (how it determines what functions to call when a change happens). The post doesn't need to mention Preact because every other framework is signals-based except for React. Vue is simply the stand-in for "signals-based reactivity". Vue has different syntax from Preact (though it, too, can also use JSX), but it has the same reactivity principle. https://preactjs.com/guide/v10/signals/ https://preactjs.com/guide/v10/signals/ > What makes Signals unique is that state changes automatically update components and UI in the most efficient way possible. Automatic state binding and dependency tracking allows Signals to provide excellent ergonomics and productivity while eliminating the most common state management footguns. It uses the same underlying reactivity model as Vue, Svelte, Solid, and Qwik. Vue docs: https://vuejs.org/guide/extras/reactivity-in-depth.html#connection-to-signals https://vuejs.org/guide/extras/reactivity-in-depth.html#conn... Solid docs: https://www.solidjs.com/docs/latest/api#createsignal https://www.solidjs.com/docs/latest/api#createsignal Svelte: https://svelte.dev/blog/runes#Signal-boost https://svelte.dev/blog/runes#Signal-boost Qwik docs: https://qwik.dev/docs/components/state/#usesignal https://qwik.dev/docs/components/state/#usesignal In the blog post, Vue is the stand-in for signals-based reactivity. All signals-based reactivity models work the same way at a high level (their difference being primarily in their low-level DOM diff and update). My prediction is that even React will eventually end up signals based because of TC39 Signals: https://github.com/tc39/proposal-signals https://github.com/tc39/proposal-signals

sesm 2y ago
Preact is not signals-based, it uses the React model with state and props as the basic model, but also provides Signals as a parallel model.
- CharlieDigital 2y ago
  I guess that's like arguing a Prius Prime isn't electric because even though it has a battery and can drive all electric, it also has a gas engine. :shrug: But very clearly, Preact has the option of the exact same reactivity primitive and design as Vue, Solid, Qwik, and Svelte https://preactjs.com/guide/v10/signals/ https://preactjs.com/guide/v10/signals/ > In Preact, when a signal is passed down through a tree as props or context, we're only passing around references to the signal. The signal can be updated without re-rendering any components, since components see the signal and not its value. This lets us skip all of the expensive rendering work and jump immediately to any components in the tree that actually access the signal's .value property.
  - sesm 2y ago
    I'll accept an analogy with a hybrid car. In this analogy, Preact would be a gas car with an additional electric engine bolted on as an afterthought.
    - CharlieDigital 2y ago
      But you know, the Prius Prime is a PHEV as in "plug in hybrid electric vehicle"
      - sesm 2y ago
        Oh, I see what you mean now! This sounds like a very good analogy.