News for hackers. Stuff that matters.
Re:A Visual Guide to React Mental Models: UseState, UseEffec... by pier25 on Friday May 29, 2020 @12:20PM (#23351927)
I haven't used React since before hooks were introduced but I switched to Svelte a couple of months ago and now I find the cognitive load of using React totally unnecessary. Even more now with hooks.

In Svelte you never think about these or other considerations (eg: useMemo). Just update some state and that's it. Svelte will render consistently faster than React, with less code to write (and maintain).

It's true with React you get a bit more flexibility but I have yet to find a situation that cannot be solved with Svelte.

Re:A Visual Guide to React Mental Models: UseState, UseEffec... by superhawk610 on Friday May 29, 2020 @03:35PM (#23354525)
To say that you never have to think about those considerations in Svelte is pretty unfair - reactive declarations/statements are functionally equivalent to hooks, and they also carry a somewhat nonintuitive cognitive load until you've begun to "think in reactivity". It's also worth considering that hooks, while unintuitive in function, do use intuitive, non-magical syntax (unlike Svelte's reactive syntax). FWIW I like both, I just think they're both equally unintuitive until you make the mental connection.
Re:A Visual Guide to React Mental Models: UseState, UseEffec... by pier25 on Friday May 29, 2020 @06:47PM (#23356503)
I guess we're all different, but I've never had to think much about reactivity in Svelte.

Most of it can be explained in a HN comment:

Component state just does its thing. You change it with = and the component is re-rendered.

Writable stores need to trigger changes with set() and you need to use $ whenever you reference it in a .svelte file so that Svelte handles subscription automatically.

Reactive statements $: are a bit more complex. Every variable inside those is referenced by the compiler so that it knows when you are mutating it. Either with = or if it's a writable store with set().

Re:A Visual Guide to React Mental Models: UseState, UseEffec... by untog on Friday May 29, 2020 @01:08PM (#23352579)
I have to agree. I still haven’t used hooks yet and I’m sure I’ll get used to them when I do, but by comparison to this article Svelte is a breath of fresh air. It’s simple, it works. A lot of people object to it because it’s very different to React, but judging by the diagrams in the mental models here I don’t think that’s any bad thing.

An aside, and I know complaints about hooks are very boring now, but I remember when React first arrived on the scene. The API was a delight. shouldComponentUpdate, willReceiveProps, etc. Everything was so clear from the first second you picked it up. Now? I’m less sure.

Re:A Visual Guide to React Mental Models: UseState, UseEffec... by christophilus on Friday May 29, 2020 @05:44PM (#23355915)
I like Svelte a lot, but there’s definitely cognitive load when dealing with reactivity. In React, it’s top-down dataflow, which is generally easy to reason about.

I prefer the functional programming approach of React, but I love the performance and some of the developer ergonomics of Svelte.

Re:A Visual Guide to React Mental Models: UseState, UseEffec... by akiselev on Saturday May 30, 2020 @02:36AM (#23359021)
You don't have to use two way binding binding in Svelte. You can bind to change events just like in React and update your reactive variables directly. The primary downside is enforcing it in the code everyone else on your team writes.