6 ms·
Wow, just learned of Svelte from this. After reading their explanatory blog post and coming upon this blurb: That all changed with the advent of hooks [React
by thebradbain 7y ago
Wow, just learned of Svelte from this. After reading their explanatory blog post and coming upon this blurb:
That all changed with the advent of hooks [React and Vue],
which handle state in a very different fashion. Many
frameworks started experimenting with their own
implementations of hooks, but we quickly concluded it
wasn't a direction we wanted to go in
...
We can just use the language. Updating some count value — and
all the things that depend on it — should be as simple as
this:
count += 1;
That's super exciting to me, as it puts the emphasis back on solving the task at hand and instead of framework nuances around state management. Will definitely be keeping my eyes on it.
https://svelte.dev/blog/svelte-3-rethinking-reactivity https://svelte.dev/blog/svelte-3-rethinking-reactivity
- simooooo 7y agoSounds good until you see the $: syntax
- IshKebab 7y agoUnfortunately even though it is written in Typescript, it doesn't actually support Typescript, which makes it a no-goer for any serious work.
- tomduncalf 7y agoFWIW, MobX lets you mutate state in the same way. It does require you to make use of its observer/observable functions to make things reactive, but in general it works amazingly well. I strongly urge everyone to try it!
- Epskampie 7y agoAgreed. I feel so weird seeing everyone messing around with hooks while all the time I've been using what feels to me like a much simpler better solution. If you know React, look at the "Ten minute introduction to MobX and React" to see if it's for you. https://mobx.js.org/getting-started.html https://mobx.js.org/getting-started.html
- pier25 7y agoMobX is great. It's even better when you remove the virtual dom and rely only in its internal dependency tracking: https://github.com/ryansolid/mobx-jsx https://github.com/ryansolid/mobx-jsx
- tomduncalf 7y agoHuh, interesting! I’ll have to try this out, thanks
- nailer 7y agoYeah Svelte is the next thing. Backbone and Angular were great, but then came Vue and React. Vue and React were great, but then came Svelte. It's: - Simpler. You change values with `=` not some method call. - Faster, as the svelte compiler dynamically creates bindings at build time, vs a virtual DOM that has to dynamically track binding at run time - Smaller, since Svelte's output doesn't include Svelte.
- s_y_n_t_a_x 7y agoSvelte is just a web framework, React is a software framework. Then there's the missing Typescript support... That's what happens when you create your own template syntax...again. I'll continue to use React so I can simply use Typescript for my components, not some random syntax. My styles are typed, my components are typed, my state is typed. Why would I ever go back?
- nailer 7y ago> That's what happens when you create your own template syntax...again. > I'll continue to use React React also created it's own syntax. Svelte's syntax looks more similar to preceding work than React's syntax did.
- s_y_n_t_a_x 7y agoJSX is syntactic sugar for function calls, but they are still just JS functions. You don't even have to use JSX. Templates are 5 steps backwards, Svelte overall is a leap backwards. Familiarity != simplicity. The only thing I'd use Svelte for is for simple websites, but oh no you can't because it requires JS...
- nailer 7y agoIt seems like you're splitting hairs. React had a new syntax. Svelte has a new syntax too, albeit a familiar one. You can call Svelte's syntax 'templates' if you want, but if you do, you should call JSX a 'template' syntax too. You seem to be saying templates are bad, which is fine, but a vdom and a compiler are both sufficiently different from, say, mustache templates and you seem to be favoring React for no technical reason. > Familiarity != simplicity. Sure. But you literally just said: > That's what happens when you create your own template syntax...again. Which seems to indicate you preferred familiarity. I'm not really sure what your argument is except pointing out that you prefer React. OK.
- batiste 7y agoI implemented a similar feature in the Blop language, but by simply using a Proxy https://github.com/batiste/blop-language https://github.com/batiste/blop-language Not sure why they claim proxies are complicated... I found it was a piece of cake to implement a working library for state management using a Proxy.
- erokar 7y agoSvelte seems promising. I think it's a natural evolution from what I think is an over focus on FP and purity in React, to a more natural and intuitive DX without significant drawbacks. Svelte does have an irritating wart IMO, citing their tutorial: Because Svelte's reactivity is triggered by assignments, using array methods like push and splice won't automatically cause updates. So for reference types that are mutated in place you need to do something like: numbers.push(numbers.length + 1); numbers = numbers; Or: numbers = [...numbers, numbers.length + 1]; This looks like a leaky abstraction to me since it forces the developer to work according to the implementation details. Don't know how easy it would be to fix this.
- desdiv 7y agoI'm a huge fan of persistent data structures such as those implemented by immutable.js. The "normal" way that I would update an immutable.js List is just: numbers = numbers.push(numbers.length + 1); Maybe it's just a coincidence, but Svelte seems awfully congruent with the pure FP way of doing things.
- mb7733 7y agoTo be fair, React has the same "wart". React is not guaranteed to work properly if you do: numbers = this.state.numbers; numbers.push(numbers.length + 1); this.setState({ numbers: numbers }); React docs here: https://reactjs.org/tutorial/tutorial.html#why-immutability-is-important https://reactjs.org/tutorial/tutorial.html#why-immutability-... Similar docs for redux: https://redux.js.org/recipes/structuring-reducers/immutable-update-patterns https://redux.js.org/recipes/structuring-reducers/immutable-... There's no good way around it without doing deep equality checks everywhere which is not reasonable.
- erokar 7y agoSince Svelte is a compiler I was thinking they could wrap the exported variables in an observable of some sort and make any method call on the reference variable trigger a value update behind the scenes. I have now idea how costly/complex that would be though. Also, maybe it's a conscious choice and they want to make any data update explicit with reassignment.
- elwell 7y agoThe biennial JS framework migration makes me glad to be in ClojureScript world, where it's a little more static (in a good way). Well, perhaps thats a function of its smaller developer base. ClojureScript + Re-frame + GraphQL subscriptions (Hasura) is the most fun combination I've used in a while. I hope nothing 'better' takes the CLJS market anytime soon.
- pier25 7y agoSvelte is great but IMO it has some weird dev ergonomics.