I liked the part where he said "It's svelting time!" and svelted all over the code base
@asatorftw
8 ай бұрын
The fact that I can now use reactivity in normal js/ts files alone is pure gold! YES!!!!
@kasper_573
8 ай бұрын
In what way are svelte files normal js/ts files?
@Karakatiza666
8 ай бұрын
@@kasper_573 runes can be used in js/ts
@kasper_573
8 ай бұрын
@@Karakatiza666 runes can be used in svelte files. Calling svelte normal js is just plain ignorant. It’s the same whitewashing bs as with ”react is just js” all over again. I think svelte is great Because it has extended js with great features. If I wanted to use normal js, guess what I would use? Normal js!
@boi8240
8 ай бұрын
@@kasper_573What... Svelte adds a compile step to ts and js that makes runes work. All it does is offer the convenience of Svelte's reactivity outside Svelte components. It just removes the distinction between svelte stores, ie: reactivity outside components, and in-component bindings, which have a whole different logic.
@nothappyz
8 ай бұрын
@@kasper_573 they are clearly talking about the compiled js
@Daktyl198
3 ай бұрын
At first I was extremely wary, and felt like it was ruining the entire purpose of Svelte. But the more I used it, the more I realized how much easier many things are, and the syntax remains minimal and elegant. Truly amazing work by the team.
@DavidMulderOne
8 ай бұрын
It moves away from what svelte originally tried to do, because it turned out that it was impossible/harder than expected, and this totally seems like a step in the right direction 👍
@lintendo100
8 ай бұрын
Looks amazing! I really hope we'll get some proper official devtools with component inspector soon. That's the one thing I'm missing from Vue :)
@dv4able
8 ай бұрын
+
@MrVauxs
8 ай бұрын
Doesn't the Vite Inspector do the job?
@TayTayChan
8 ай бұрын
@@amirhosseinahmadi3706 The "old" behaviour hasn't actually changed, has it?
@VaelVictus
8 ай бұрын
@@amirhosseinahmadi3706Rich directly said in the video that he wants to emphasize that things are not changing. Nothing was lost. They're only adding new.
@jalalle1995
8 ай бұрын
@@amirhosseinahmadi3706 how? isn't the goal of signals to enable fine grained reactivity?
@sadramohh
8 ай бұрын
I really want to see Ryan Carniato's reaction to the new signals and runes
@milesq
8 ай бұрын
It looks sooo similar to what we have in react/solid/vue. In the past years all of those frameworks have become so similar that it is hard to see some true differences in DX
@gimp3695
8 ай бұрын
Came here to say this. I’ve been a react developer for a long time and now it feels like I’m back in react. Need to digest if this is good or not.
@TunaCanGuzzler
8 ай бұрын
You can choose to not use it. The problem with react is the shadow Dom, not the 'reactive' feature set
@pozz941
8 ай бұрын
@@TunaCanGuzzlerThat is not entirely true, I think that to many the performance are not the main reason they are using svelte. My initial interest in svelte was born because looking at the code was like looking at what html, css and js should have been all along. I really liked the magic of svelte and I wish they found a syntax that better reflected that. Maybe something like "state variable = 0" instead of "let variable = $state(0)"
@milesq
8 ай бұрын
@@TunaCanGuzzler yeah, the same way I could choose to not use hooks and stay with react class components. So only theoretically
@raph151515
8 ай бұрын
I wonder if these "hooks" come with the same downside as react's one have (hook hell), svelte having a component instance scope, the context is completely different, the issue with hooks is that they often don't play well with non hook code, but they say avoid hooks if possible, so you end up never knowing how much hook to use, I hope svelte is not going in this direction@@gimp3695
@docmars
8 ай бұрын
Looking awesome! I can't help but to point out: Svelte React 1. $state = useState 2. $derived = useMemo 3. $effect = useEffect 4. $props = usual props destructuring at the function args level I think this will attract a lot more people from the React community and benefit from Svelte's other goodness!
@Viviko
8 ай бұрын
Probably more on the lines of Solid, given it uses Signsls which Solid popularized. It can be argued that the choice of names is similar to React. But that’s honestly where the similarities end.
@ReddSpark
7 ай бұрын
I'm newish to all this and trying to make a bet on where front end dev might be in a few years. If svelte is becoming more Solid/Reactlike , why not just stick to Solid/React?
@Hugos68
6 ай бұрын
@@ReddSpark Because then you don't get to use svelte
@jnevercast
5 ай бұрын
@@ReddSpark Keep in mind that these runes are compiler macros, rather than functions, so they can do a lot more magic behind the scenes to keep your code minimally reactive and maximally fast.
@marfagerland
5 ай бұрын
Derived looked more like useEffect to me. Changing a value when a variable changes. Correct me if wrong though 😊
@xbsidesx
8 ай бұрын
Looks like you're helping people transition from React a lot smoother. I embrace the idea. The "rune" name is... well, it's fun and it helps remembering. All in all, big props for svelte. I hope I can use it in the near future in my paid job.
@MagicNumberArg
8 ай бұрын
If you are coming from React - SolidJS is a much better fit. Signals from the very beginning and flexibility of JSX.
@xbsidesx
8 ай бұрын
@@MagicNumberArg Its ecosystem is not wide enough in my opinion. Also, I tried to work with a simple websocket once and it was really hard. Hopefully it's better now.
@MagicNumberArg
8 ай бұрын
@@xbsidesx Solid's ecosystem is very robust. The reason why it might seem smaller than React's at times is because a lot of things are already built into it. For example, you dont have a dozen state management libraries to choose from for SolidJS, but only because the optimal store solution is already built into it's core.
@thienhuynh7962
8 ай бұрын
@@MagicNumberArg I think he's comparing solid's eco system to svelte's tho
@seijiphirao
8 ай бұрын
Awesome! Seeing how these states patterns are starting to get implemented in various frameworks I would love to see someday a native solution similar to these runes, something like: let state counter = 0; let derived doubled = counter * 2; effect function(mouse) { last = mouse };
@JrgenKalsnesHagen
8 ай бұрын
Agreed, but if it's gonna be native there's no reason to keep "let" and "function": derived doubled = counter * 2; effect(mouse) { last = mouse }; looks a bit weird now, but I think it would look better with syntax highlighting
@Rtzoor
4 ай бұрын
@@JrgenKalsnesHagen look brilliant, i sure hope this will happen some day and we will be able to shed another layer of complexity from web apps
@ethanreker3333
8 ай бұрын
This is very exciting! Big thanks for all of the hard working devs who've made Svelte a reality! Several years ago when I first discovered Vue, I was blown away by how much simpler and flexible it was than other frameworks I had tried. It was my absolute favorite framework to work with and I evangelized it to every other dev I knew until... I found Sveltekit. I had the same feelings/experience towards it but maybe even stronger. I honestly cant imagine how it can get much more productive and clean that it already is, but it looks like your team is finding a way! Looking forward to the version 5!
@AmxCsifier
8 ай бұрын
Brilliant. It's what svelte needs exactly. You guys are just brilliant!
@sadkebab
8 ай бұрын
This fixes most of the issues I had with adopting Svelte on a larger scale in my projects. I really can't wait for Svelte 5 to come out.
@Huntabyte
8 ай бұрын
Let's goooo!
@enchart
8 ай бұрын
Hype!
@harryickeringill2948
8 ай бұрын
Excited to see what this means for Melt
@daleryanaldover6545
8 ай бұрын
@@harryickeringill2948This is huge
@nooalovern
8 ай бұрын
Time to make some new videos brah😅
@jakobsturm2438
8 ай бұрын
Looks slightly overwhelming at first glance but I believe that these are the correct changes for the future of Svelte
@sherwinbangs
8 ай бұрын
I chose Svelte for simplicity but now it's starting to look like React and I'm terrified
@CottidaeSEA
8 ай бұрын
@@sherwinbangs No dependency arrays present, so seems fine to me. I am concerned about using $effect for onMount functionality though. That does not at all seem healthy.
@ISKLEMMI
8 ай бұрын
@@sherwinbangs It's looking more like SolidJS and (thankfully) not React.
@vaisakhkm783
8 ай бұрын
@@sherwinbangsikr... just $: feels soo good
@kylerjohnson988
8 ай бұрын
@@CottidaeSEA Why doesn't it seem healthy to you? Aren't life cycle functions like `onMount` essentially effects themselves?
@accexp
8 ай бұрын
I watched some videos about Svelte 5 runes in the past couple of days and came across some negative reviews about this new mechanism. Including myself, I was initially confused about what this new mechanism was primarily designed to solve. So far, many videos I've watched introduced runes using `Counter` as an example, but using `$state` in such a simple example like `Counter` seemed to complicate things unnecessarily. It wasn't until I watched Huntabyte's "Don't Sleep on Svelte 5" that I got a preliminary understanding of the benefits this new mechanism can bring. In my opinion, runes currently lack real-world examples to convince people to try them out, and I hope to see more practical demonstrations in the future that address real problems, especially how it can make compliated code simple, rather than just using `Counter` as an example.
@cstrnt
8 ай бұрын
Oh man, what a great job from the svelte team and also Rich is just a king at those videos. Short, informative and funny
@mormantu8561
8 ай бұрын
Looks pretty great at first sight. Providing a more advanced reactivity model for those who need it based on signals. Which are, as others mentioned, also used in other frameworks. Seems like a really solid choice. Props to the developers!
@vitiok78
8 ай бұрын
So... This is Vue 3 now? Only compiled?
@pjmq
8 ай бұрын
I haven't had the "Aha I get it!" moment yet but I'm hoping I get there. It's giving me rather nasty React vibes though so it would have been excellent to have an apples to apples comparison of how and why it's different from React's useEffects etc etc. in other to quell that uneasiness that I'm sure many people are having right now.
@isdeonf
8 ай бұрын
It's normal to read "$state" and "$effect" and get memories from "useState" and "useEffect", but other than the word they share, they're nothing alike, not above the hood, not under the hood. And this new pattern enables Svelte to generate faster code, smaller bundle, reactivity in .js and .ts files... better derivated values than the problematic $:... it's a great tradeoff.
@WilsonSilva90
8 ай бұрын
@@isdeonf Even if they are nothing alike, it expands the API of Svelte, making it more complicated. Simplicity is key and JavaScript libraries tend to grow in complexity until they are no longer useful. That's why they are always being rewritten and that's why there's a new JS library every other day.
@LongNguyen-dh3bm
8 ай бұрын
@@WilsonSilva90 It is a bit more complicated than current Svelte, but everything should be more consistent, with reactive variables now represented by the same thing (runes), and uses the same syntax. Also speed is much faster due to the fine grained reactivity that it brings.
@crab-cake
8 ай бұрын
@@WilsonSilva90 it's really not that much more complicated though. i think it's actually more clear and now we can use svelte behavior outside of svelte files.
@derschutz4737
8 ай бұрын
@@WilsonSilva90 it literally doesn't expand the api. the api is the same but just syntactically different. Instead of reactivity being an implicit property, it's explicit.
@dethcx22
8 ай бұрын
This was my biggest friction when trying out Svelte; Feels a lot more Vue like now with those primitives being available, and fixes the problem with reactivity outside of a component, excellent.!
@DEVDerr
8 ай бұрын
This video gives me strong React Hooks introduction vibes with this "rune" branding... which I'm not sure if I like. But if those "runes" will have even better DX (on top of already fantastic DX), then I will like it immediately. Hopefully the $effect() will not have the same pitfalls like useEffect() has
@gamerzone8876
8 ай бұрын
This effect is signal based, unlike React, which runs after render.
@untlsn
8 ай бұрын
No, it good old signals If fact only react don't use this patter now days from bigger players (vue, angular, solid, qwik, preact) And I'm sure you will love it!
@cristianosoleti489
8 ай бұрын
Vue doesn't use signals@@untlsn
@danvilela
8 ай бұрын
It’s optional! But still, way better than reacts version
@jrmc732
8 ай бұрын
The effect will have the same pitfalls if you are not careful and try to set a value inside the effect which at the same time is also used in the same effect.
@LeonRadley
8 ай бұрын
This is going to be epic! All the things I found a bit weird about svelte can now be written differently. and the mental model being signals means jumping between angular, solid, svelte is also going to be easier. 🚀
@raph151515
8 ай бұрын
most of the use case don't require this addition and is simpler using svelte state, store are great, this addition shouldn't be overrated because you should still learn to work without for most of the cases.
@bauxite13
8 ай бұрын
Playing around with it, I'm really glad that using runes in a separate file and then importing it does NOT turn the whole component into rune-mode, which is really nice!
@mendodev8775
8 ай бұрын
I'm really happy about the new `$props` rune. The current way of exposing props was not intuitive to forward implicit props with type safety (like all the html attributes for a simple button). Congrats to the whole team, looking forward to try this out! It looks great 🔥
@Pavel-wj7gy
8 ай бұрын
I'm still waiting for the $LayoutEffect rune too
@Dev-Siri
8 ай бұрын
I agree. before I had like so many complicated hacks, type assertions and rest operations just to make a customizable button, but now it looks like it is more like React which I think is honestly for the better. I think the way JSX frameworks like React handle props with an object, are better for reusable UI components like buttons because you can destructure what you want, and spread the rest. Currently, in one of my Svelte UI components, there are so many hacks I did just to get type-safe props and use some custom props the way I want to.
@MrBlackhen
8 ай бұрын
the current way is just `export let count: number` and it's type safety?
@gamerzone8876
8 ай бұрын
Finally, Svelte is adopting signals. 🎉 Those reactive statements gave me a hard time debugging
@MagicNumberArg
8 ай бұрын
Yeah, only took them 5 years...
@chriss3404
8 ай бұрын
YES!!!!!! This is exactly what svelte needs. I love writing new Svelte components because its almost always simple and intuitive to wire up my state and be done with it, but when refactoring time comes for complex, Svelte-specific code, everything takes 2-3x longer than it should because of those exact issues. So exciting!
@PierreLebrunAnthony
8 ай бұрын
Nice! As a daily Vue user this feels very comfortable - similar functionality to the composition API (I especially like how computed/derived values are made explicit with a special keyword) but better ergonomics enabled by the compile time approach.
@JViz
8 ай бұрын
It looks like you're replacing the "special" code and syntax with monads. This definitely feels like a good direction. Thank you for the update and I look forward to using the improvements.
@sadramohh
8 ай бұрын
Svelte finally embracing signals brings a smile on my face :) Signals for the win!
@heisenballs
8 ай бұрын
Was on the fence about using svelte for a new project, but now I'm definitely gonna do it!! Thanks for all the hard work Rich!
@Sefriol
8 ай бұрын
I think these were the primary gripes why I preferred Vue over Svelte. Especially the mind games that you had to play when dealing with Svelte vs TS/JS files. I hope to try Svelte 5 in my next project soon!
@user-sv5gt1lo3b
2 ай бұрын
As someone just learning Svelte, I'm pretty excited to see the props rune usege here. I always found it weird to wrap my head around the 'export' statement within a child component, when in my head it felt like it should have been an 'import' statement.
@davemackintosh9617
8 ай бұрын
This looks like some great improvements. Well done to all involved!
@_fayeznazzal
8 ай бұрын
Amazing! I think Runes will have great impact on Svelte the same way hooks impacted React, it helps people learn those tools way easier.
@brandonculver8911
8 ай бұрын
The first 3 minutes of this video is ironically the single most concise argument against Svelte I have ever seen. Runes look a lot better, but it also smells a lot more like Solid and React now tbh. Feels a little shark jumpy.
@HeatingUpDuke
8 ай бұрын
Not gonna lie, 5:41 was exactly my reaction at first but thinking about it I think it's the right decision. Can't wait to try it at home. Congrats to the team for the awesome work as always!
@aldanasjuan
8 ай бұрын
I've fixed the first problem by passing the variables to the $: statement, like so: $: doubled = doubleCount(count){...}, the compiler reruns that statement and function when count changes, no store needed and the function remains simple. You can even ignore the arguments passed into the function if all you need is to rerun the function when that 'count' changes. That being said, I love the idea of not losing sync with other functions and being able to use runes in .js modules. All the other stuff looks like sugar too.
@iamnoone3588
8 ай бұрын
this update is giving me react vibes but weirdly enough i kinda like it 🤣
@merovingen4546
8 ай бұрын
looks awesome, but questioning about using state rune, looks like we won't be allowed to use more then once at the component? I fill I'm wrong but it is as fire as it for now
@jengstrm2
8 ай бұрын
Congratulations to Rich, the team, and all the BelieVers🎉it’s great to see the framework simplify the complexity around rendering modern UI. It seems like a real step forward.
@semicognitive
8 ай бұрын
Absolutely amazing. Loved being a part of this community for the past few years
@jazsouf
8 ай бұрын
It look interesting because what makes Svelte enticing is what's under the hood (compiler etc.) The Rune syntax looks closer to React, which might help people to try out Svelte!
@shrin210
8 ай бұрын
Nope, React crowd will choose Solidjs just bcoz of JSX 😂 I think Svelte got even more cluttered with derived and effect.
@leopb21
8 ай бұрын
Awesome! Much more intuitive way to create and reuse pieces of logic for different components.
@seabass_1
8 ай бұрын
You once again solved problems before i experienced them. Ill thank u in a couple weeks once this sinks in!!
@xazzzi
8 ай бұрын
1. What if derive does not hit dependencies .get? Ex: it's under if branch. 2. How do i ignore some dependencies that shoud not trigger recalc? I used $: fn() with explicit dependencies often for this exact purpose. 3. Does it mean svelte compiler should now run in all files to detect/compile runes? It looks like mobx tbh.
@peepeepoo3432
8 ай бұрын
I'm so happy about $props. Also I would like to point out that you talked about the performance problems in #each blocks but you don't show how the runes model fixes it. I assume Svelte 5 will use fine-grained reactivity a-la Solid, but at least mentioning it would have been nice.
@daviidon
8 ай бұрын
It's using signals. He showed it in the generated output.
@shrin210
8 ай бұрын
Like Steve Jobs, he is marketing genius 😂
@marwi_123
8 ай бұрын
Thank you for the video. This is probably not the right place to ask this but have you considered to allow to use the v4 syntax for these kinds of things instead since it is way easier to write and remember - and use svelteconfig to tell svelte to use v5 globally or add a call per svelte file for more fine-grained control if i just want parts of my code to use the new features?
@marwi_123
8 ай бұрын
One of the great features for svelte for me was that it did not need a lot of special syntax or method calls to get a lot done. While i understand this will continue to work it would have been great to get the same features while still using the simple syntax
@amirhosseinsoleimani5410
8 ай бұрын
Big W man, I kinda prefer this new syntax. syntax of Runes is more similar to React and VueJs features which means those devs can learn svelte and migrate to it more easily and I like that they used signal mechanism for reactive states.
@hoelldrio5881
8 ай бұрын
'Good luck catching us now' 😂
@andreypanin2136
7 ай бұрын
Can someone please explain when is `$effect()` supposed to run, how it's different from the reactive declarations in Svelte 4 and what makes it a replacement for `onMount`? Does the use of `$effect()` eliminate heuristic analysis of the variable names used within the function passed to the `$effect()`?
@CottidaeSEA
8 ай бұрын
I am slightly concerned about $effect being used as onMount behavior. Exactly how does that work?
@xazzzi
8 ай бұрын
Also concerned about it, onMount runs once, effects - whenever deps change, not the same.
@CottidaeSEA
8 ай бұрын
@@xazzzi Yeah, it's dangerous since it all depends on what happens inside of the effect. Since onMount isn't going anywhere, using it is not really a problem, but I've used React enough to know that the reliance on useEffect is detrimental. You can't avoid side-effects, but being able to better control when and why things happen is incredibly important and React only recently added an experimental feature for that purpose. In the case of React, the issue is moreso the fact that they have a dependency array though.
@thanhdatvo0
8 ай бұрын
Beautiful, beautiful. Great work. Thank you, Rich!
@oskarzoch8946
8 ай бұрын
Oh yes! Building complex custom stores for responsive modules isn't fun, this change looks so much better! Can't wait for the release.
@Milky____
8 ай бұрын
I can't explain how excited this makes me, never thought code could make me feel this way 😊 Ty Mr.Harris!
@tedspens
8 ай бұрын
Thank you and the Svelte team for making web development awesome. Looking forward to 5 and Runes! 👍
@MrEnvisioner
8 ай бұрын
This is fantastic! I'm so excited to use these features. Amazing work by the dev team. Holy crap... I'd like clarity on under what conditions the $effect triggers though. Is it the same as $: { ... } blocks where all referenced symbols are tracked? Does this happen recursively through other function calls in order to traverse things like `createCounter()`? Another commenter mentioned how this would let them get reactivity from even external js/ts files, so I'd like clarity on how the symbol tracking / evaluating all works. That's the most confusing tidbit. Other than that, it looks WAY simpler than the old model. Bravo!
@baka_baca
8 ай бұрын
Hold on, it only took me a few hours to feel comfortable with Svelte and now it's going to be even easier... sign me up! Also, calling them runes is just amazing. Cheers, Rich!
@dexter-wy5bo
8 ай бұрын
is the release timeline (even just an alpha?) like a “i can probably wait to start this new app that would really benefit from this” or more like “write the app in v4 and refactor later” timeline?
@coffee-is-power
8 ай бұрын
This changes... EVERYTHING! I've written a lot of spaghetti code in svelte because there was no way to do better, but this will significantly improve the way i write and design code in svelte.
@davidsiewert8649
8 ай бұрын
Hurray, finally we have react hooks in svelte! People, rejoice!
@IAmOxidised7525
8 ай бұрын
Hmm , but runtime reactivity sounds like shipping a little bit more JS to the browser ? Will this affect bundle sizes ? Cost of JS
@andrewcraswell4117
8 ай бұрын
The cutaway to Planet of the Apes was the laugh I needed this week xD I'm also loving this change. Less magic, more explicit. This will be easier to learn and grok for both novices and experienced devs alike.
@stema84
15 күн бұрын
So this derived is calculated whenever it's read? Wouldn't that mean if it is read a lot of times it is less optimal than the old method where it was calculated once then read multiple times?
@patricknelson
8 ай бұрын
Also can’t wait to learn more about the speed improvements too. 🚀 Excited for the future.
@Bauxitedev
8 ай бұрын
Looks nice, the way you define props reminded me of Vue's defineProps()
@Dev-Siri
8 ай бұрын
never have I been so excited for a JavaScript framework before.
@shrin210
8 ай бұрын
🤢
@Dev-Siri
8 ай бұрын
@@shrin210 what's there to be disgusted about?
@shrin210
8 ай бұрын
@@Dev-Siri Javascript framework itself, even svelte couldn't get it right in first try with all the past experience of other framework. And cluttered even more with derived and effect.
@Dev-Siri
8 ай бұрын
@@shrin210 I see nothing wrong with that. The old reactivity model will probably get deprecated and removed in future versions of Svelte just like how React is close to removing class components. but for now, I think its pretty solid. it gives us time to migrate which is simpler than ever and the new APIs make more sense in my opinion instead of implicitly guessing that _this variable is state and this is normal_
@shrin210
8 ай бұрын
@@Dev-Siri Reactjs doesn't have class components for 3 years now I think. Aahhh ha, old reactivity model is useless that's how Reactjs introduced new features and everything is deprecated now. Now, Under 1 year after Sveltekit creation and usage, already features are getting deprecated, beating record of React Class with hooks 😂 Hopefully, people didn't shipped any projects in old svelte. AND this should not be NORMAL.
@b1ting375
8 ай бұрын
dev: shows you a beautiful, awe-inspiring new world also dev: you can't install it yet. we don't have a release date.
@CodyCasterline
8 ай бұрын
The $state rune seems a bit like signals in Preact, and $effect seems like React's useEffect(). I'm interested in hearing lower-level details about how they differ. (We're not ending up w/ the React problems of having to make sure all your use*() functions are called in a reliable order, for example, right?) Also: How much of their functionality is handled by the Svelte compiler vs. just implemented in pure JS at runtime?
@tonystroemsnaes554
8 ай бұрын
use*() function equivalents in svelte will not have to be called in order. I'm react, this happens as a consequence of the component lifecycle (all the code for a component is rerun on each render), but since svelte uses signals, that won't be needed. This is the same way vue works
@Bobbyhiddn
8 ай бұрын
I am now adopting svelte strictly for the wizard vibes. I already build all my tools with magic related names, so this is perfect.
@Manish___Choudhary
8 ай бұрын
It's my personal opinion, Runes just ruens the developer experience. I love only that Props rune.
@untlsn
8 ай бұрын
In small components yes But for bigger components and "hooks" it's will be much better
@NevelWong
8 ай бұрын
How will we use runes in our js files? Will we need to manually import them as real functions? Because I work on a framework which uses the same $ notations a lot, and I fear for name clashes if we can't alias the runes.
@helleye311
8 ай бұрын
Looks quite good! I haven't been using svelte because the syntax was all so... magical. Every let was reactive, the props thing was kinda odd too. This takes away all that magic in favor of explicitly saying what something is. Sure, it's more code to write, but 5-6 letters isn't gonna kill anyone, especially with autocomplete, and this feels a lot more readable to me. I mean don't get me wrong, the current syntax looks great and clean if you're coming from a JS background, but for anyone that used a framework before (or me at least), yea, bit too much magic happening under the hood. Although I might still use it, if it's interop I can see that with practice some components would be much quicker to write with the old syntax, if you just need 2 props and single state, but the new stuff would work better for more complicated components. Might give it a try at some point!
@brianevans4
8 ай бұрын
This feels like it's getting closer to react... Thanks for making svelte, I love using it!
@annismonadjem6901
8 ай бұрын
Can't wait to get my hands on Svelte 5! Bravo Rich and Svelte team! Great job! Thanks.
@vutruong4164
8 ай бұрын
Holy cow! So Svelte is also joining the Signal party after Solid, Qwik and Angular made Signal their state management and reactivity primitive. At this point, Signal should just be included as a Javascript primitive already. And the creator of Signal should receive a Nobel Peace prize for making all the frontend frameworks AGREE on a common state mgmt and reactivity model
@Psy45Kai
8 ай бұрын
*caugh * Qt *cough *
@thehibbi
8 ай бұрын
Bless you, that was a loud one!
@pevey
8 ай бұрын
Rich: "We svelted all over your code base."
@seabass_1
8 ай бұрын
"Counterexample...counter example (two words)"
@sadunozer2241
8 ай бұрын
Even though it looks like react it works like svelte. Awesome, I haven’t had the chance to dig as deep as I’d like in to svelte, but I’m working on it.
@jhonatanjacinto
8 ай бұрын
Amazing! Keep the great work guys!!!
@JulioWandekoken
8 ай бұрын
Well, the $effect with the cb that is executed on the component unmount looks a little bit like the useEffect hook... I hope that similarities ends there... lol =P Either way, awesome stuff!
@Jake-bh1hm
2 ай бұрын
I dont really understand runes.. i just started learning svelte and its confusing me. So when would i need to use runes methods ??
@artneo7
8 ай бұрын
Svelte is the best, great news for the community! 😄
@Mankepanke
8 ай бұрын
This looks great! Well done, everyone! ❤
@johnmishell234
8 ай бұрын
Good job, great changes
@oussamasethoum1665
8 ай бұрын
This is really a great news, I just hope you done something about having methods in props and just spread them in the element xD.
@FabianVilersBe
8 ай бұрын
Great additions to this wonderful toolkit!
@yegorzakharov8514
8 ай бұрын
This has Vue 3 vibes, and im all here for it.
@SoreBrain
8 ай бұрын
This looks too good. I can't even wait to find my favorite rune 😂
@ulvidamirli2758
8 ай бұрын
At first glance, I was a bit worried of syntax changes. But then I saw that this is better choice for the future of Svelte. Both in terms of easier adoption and scalability of the apps.
@JrgenKalsnesHagen
8 ай бұрын
Love that we can use the same code in .js files as in a .svelte component. One question though: Why do we have to change *$:* to *$effect* or *$derived* when *$:* is already valid javascript? Wouldn't it be easier to keep the syntax the same?
@torb-no
8 ай бұрын
Is this new system entirely runtime based or are there still compiler aspects?
@marinaroaugusto
8 ай бұрын
This is awesome dude!
@X85283
8 ай бұрын
Rich Harris and I have the same folding table? WOW. Honored.
@mikeonthebox
7 ай бұрын
Rich, you told us that Excel sheets were great and they don't go out of sync... Svelte does, it needs to be fixed, not replaced.
@subhasishdas6930
8 ай бұрын
wow it's amazing!! One thing, can we do more than 1 component in one file with svelte5? This helps a lot too Thanks!
@ducnhatphung
7 ай бұрын
1. I can see that this is a big improvement seen Svelte 3. In Svelte 3, it's true that "the compiler automatically updates the UI for you" thing simplifies the code but you can't refactor your code into smaller chunks of functions or you will have to use "store" which is quite complex and it shifts me back to React. In Svelte 5, the new "$state" rune is similar to the functional programming approach. If you want to make some side effects, there's a datatype for it. In Svelte 5, the side effect that you want to make is to update view, the datatype for the side effect is a "$state" rune which is actually a view model. There must be some complexity when you convert between raw data to view modal (similar to other functional programming languages) but it's much more transparent than the "magical" thing that Svelte 3 have done. 2. The only problem that I concern about is that to make these things works, Svelte 5 will have to introduce developers with another kind of magic that the compiler does with runes. In Svelte 3, I have a lot of problem trying to explain with other people about how "export" and "let" keywords works. In Svelte 5, I suspect the same thing will go with how "$derive" and "untrack" functions work. Instead of focusing in plain JS, people have to figure out how the Svelte compiler makes "untrack" and "$derive" run behind the scene. I even doubt in how these runes works in JS and TS without Svelte compiler. It may make developers harder to work with other kind of tools and debugger for such kind of magic also. The same things has been done with React. The authors try to make thing simpler and attract more people by introducing people with a lot of new features and sugar syntaxes. But in reality, thing gone wrong and wild, the authors have to adjust it with many other explanations, features, videos and bug fixes which is much more complex. What developers have to do is shifting from features to features, trend to trend over and over again. I don't want to be pessimistic but for Svelte, five years time is a big deal. As developer, we must reflect on ourself seriously, see how the code we write affect to people to bring the best solution (maybe not the best but the sub-optimal solution). In the end, Svelte is a potential framework and Rich is really the thoughtful person on how the tool will move toward the developers and the community. And I really hope to see how Svelte could change developer life, many lives. Sincerely
@katywings
8 ай бұрын
SolidJS for Svelte, nice! 😄
@gauravkelkar8824
8 ай бұрын
Soooooo, would be get infinite loop crashes on $effect like useEffect?
@MrSemIsAwesome
8 ай бұрын
Yes
@andrewstacy3937
8 ай бұрын
So, what happens when you declare variables that are not assigned "$state"? What if someone has "let count = 0;" and then does "count += 1" when in runes mode?
@cedricmertig2175
25 күн бұрын
"If for example you log the values inside the increment function, you can see that it gets out of sync." What did you mean here? To me it looks like you made some changes and they worked exactly as intended. What got out of sync with what and where can I see that?
Пікірлер: 546