
Metaphysics and JavaScript - chambers
https://docs.google.com/presentation/d/1PUvpXMBEDS45rd0wHu6tF3j_8wmGC6cOLtOw2hzU-mw/preview?slide=id.p
======
nikolaplejic
It might be worth pointing out that this presentation comes with speaker notes
(keyboard shortcut: S, or click on the gear icon at the bottom and find the
link). They contain much more content (and context) than the slides alone.

~~~
mythz
Definitely worthwhile, thanks. I had viewed this presentation before but
didn't know about the Speaker notes.

~~~
hitekker
Same here. Thank you for the tip, GP.

------
ng12
I'm not sure I understand. Yes, there are some pitfalls to React Hooks (and,
honestly, they're really slick but definitely require more cognitive overhead
than React.Component) but he doesn't really describe how Svelte solves these
problems. In fact, looking at the demo code it looks pretty similar to how I'd
built it in React.

My trepidations concerning frameworks like Svelte come from things like this:

    
    
       `<input type="radio" bind:group={current} value={filter.fn}>`
    

What does `bind:group` do? What kind of magic is going on behind the scenes to
make this work? At least with React it's always easy to grok what is happening
(it's all just JavaScript, after all). Of all the front-end frameworks React
has the fewest magical invocations and that's one of the most important things
I look for in a framework or library.

~~~
nemothekid
You're missing his actual walkthrough of Svelte, that he likely did in the
demo. I've seen Svelte enough times on HN that I'm vaguely familiar with it.

Svelte, to me, at a very high level, is "Angular 1, but fast" \- which might
be easier to develop for, but doesn't provide the same "rails" that React does
(and why I prefer it).

At the end of the day, all the hang wringing about hooks and purity is about
making it simple to reason about a program locally. I haven't used Svelte so I
can't say for sure, but the problem Svelte (and that the Virtual DOM) solves
is an issue I don't think I have.

In any case his presentation was interesting enough from a FP/Programming
theory POV.

~~~
kjksf
For what it's worth: to me Svelte is, for the lack of a better word, "better"
React. It's another evolutionary step in the same direction.

I wouldn't compare it to Angular.

Svelte is both easier to use (productivity) and generates faster code.

To me React is 2 things: components (reusable pieces that combine state with
rendering logic in JavaScript / HTML / CSS) and reactivity (rebuilding UI from
state).

Virtual DOM is an implementation detail that makes rebuilding UI from state
fast enough in React.

Svelte also provides components and reactivity but with less typing (for me,
the programmer).

While I know some people complain about more magic, my experience is opposite:
Svelte maps more intuitively to the final JavaScript / HTML / CSS than React.

And it has CSS that is scoped by default to the component which removes the
need for CSS-in-JS solutions.

~~~
ng12
Too bad
[https://github.com/sveltejs/svelte/issues/1639](https://github.com/sveltejs/svelte/issues/1639)
is still open :)

~~~
lioeters
For others who are curious, this is about TypeScript support in Svelte - an
issue created a year ago.

The following comment by the author sounds hopeful, that they've been working
in that direction, and eventually it will happen:

[https://github.com/sveltejs/svelte/issues/1639#issuecomment-...](https://github.com/sveltejs/svelte/issues/1639#issuecomment-442974572)

------
_bxg1
This is a very good take. DOM as a function of state has real tradeoffs but
also real benefits; state as a function of state just gets out of hand. IMO
React Hooks are where React jumped the shark. setState and Redux were already
clunky and felt too rooted in unhelpful ideals, but hooks just took the cake.

My company's codebase uses MobX for all state and I highly recommend it. It
embraces mutability and imperative code _where they make sense_ : in your
actual app state. React is there to do what it's best at: rendering DOM.
That's it. Rendering remains functional and real, meaningful state is allowed
to be what it is.

~~~
Tade0
To add insult to injury it's fairly easy to use hooks wrong - and used wrong
they are, which suggests that their learning curve is not as friendly as
proponents of this pattern would wish.

~~~
nezygis
Could you share some examples of hooks used wrongly in code?

~~~
Tade0
useCallback used as something else than a provider of callback functions, e.g.
for rendering.

Example:

    
    
      const renderItem = useCallback(() => <Item />, []);
    

And then:

    
    
      return renderItem();
    

What should have been used here is useMemo.

------
pier25
I've tried Svelte and while I don't love some of the dev ergonomics it's a
damn fine project.

React was a great alternative to Angular back in 2015 but it's not even close
to being objectively the best solution in 2019 except for its popularity.
Preact or Inferno are so much faster/lightweight and are pretty much drop-in
replacements for React.

BTW is there a video of this presentation somewhere?

~~~
_bxg1
We pretty much only use React for rendering and lifecycle (still rocking
class-based components). Does Preact offer material improvements other than
bundle size? If so I might look into switching.

~~~
pier25
Preact is considerably faster, but maybe React is good enough in your use
case.

I also prefer using mostly class based components and some functional
components for lightweight dumb components. I use Inferno for rendering and
vanilla + MobX for everything else.

~~~
_bxg1
We certainly have performance bottlenecks in our rendering, so if a different
library is faster we're definitely interested

------
chambers
Context here: [https://www.swyx.io/writing/svelte-
metaphysics](https://www.swyx.io/writing/svelte-metaphysics)

~~~
_bxg1
Really sad there's no recording, I feel like it would be twice as entertaining

------
olingern
It’s exhausting that the author of Svelte has to continually compare his
project to React. It’s a huge red flag when someone can’t substantiate why
something is worthwhile without criticizing adjacent projects.

I understand that React is the front-end framework du jour, but React nor any
other successful project got where it is by continually criticizing others’
work.

------
dakerfp
That's the QtQuick approach.

------
marknadal
And more Metaphysics & JS:
[https://youtu.be/5BuoDqVxvOM](https://youtu.be/5BuoDqVxvOM)

