Understanding Signals

Signals became all the rage in 2023 - SolidJS made them popular, Angular is adopting them, Svelte introduces them ("runes") and Vue actually already had a Signal-like feature called "refs".
But what's the advantage of Signals? And how do they work internally?

🖥️ Official Website & Courses

💬 Academind Community

👋 Social Media

[riongull]

Great explanation. It would help to show it with an example of updating the DOM - the environment where most people would use this.

[aardvarkgroup]

This was a great, short dive into how Signals operate.I enjoy your courses on Udemy more than any other courses I purchased or watched on YouTube. Your explanation of concepts make all the pieces of the "programming puzzle" fit together. It took 4 Java programming books in the 90s to understand the concepts of that language until I got the right one. Thank you for producing these courses. It makes learning new languages easier i.e. Angular, Typescript. I am waiting patiently for the Angular Signals

[AngularUniversity]

Qwik also uses them, but we hardly see them, it's all via proxies. Angular already has a Signals API, but they are not yet fully plugged in to change detection. 👍They do already work with OnPush though, if we consume a signal in a template, a new emitted value will mark the component as dirty.

[OussemaSahbeni]

when are you going to update the angular course to angular v17 ?

[hansschenker]

React Hooks were a great inspiration for Vue 3 reactivity system (Evan Vue). Vue uses the Javascript Proxy class to track data changes. Unlike React where after each data change the UI rerenders in Vue 3 in the setup the dependencies are set with ref or reactive the Ui renderes only once and the only the html element wich displays the data change will be rerendered.

[woife]

Such a reimplementation is really helpful in understanding the concept! I still dont get the difference between other "pubish-subscriber" patterns in code (Like Observables).

[haoli]

very clear to know how is Singal going on.

[zygas]

Thank you! The topic explained in very easy way :)

[christianm]

This idea of signals reminds me of the observer design pattern, a pattern that has been around since before the web became popular. Other GUI libraries for native applications, such as the Qt framework, have successfully used this pattern. That being said, I still don't understand why this wasn't the original approach from the beginning of React.js. I also don't understand why such a bad library like React has become so popular. 😒

[onkelhoy]

huh, so I already implemented signals when implementing my own framework, wow im so good

[H-vi]

I feel the example could have been better. Kinda confusing. When you first define function read(), you also subscribe... then I would called it readAndSubscribe. Calling it "read" alone is a poor naming choice in context trying to explain the logic, IMO. And I would also not call it signals pattern, but rather classic observer pattern in that case.

[dmitryi]

Wouldn’t this infinitely grow subscribers array with every read?

[Warrigt]

every framework just having to re-name an existing system. Runes?? really?

[mkrzyzowski]

Signal proposal in js have subscribers optional

[kiana]

so many names for the same concept... they're all just atoms man: we restrict ourselves to atomic operations only so we can has thread-safe mutable variables (aka state management) which opens the way to "subscriptions" and reactive UI design

also, wasn't svelte's elevator pitch something like "sure it's the least mature framework, but look, it does away with the whole state management BS, you can treat simple variables like they're atoms..."? now it has the same syntax as the rest, but they're called "incantations" now! and when you de-ref them, you're "casting a spell"!

[lucasterable]

Syntax hideosity and convolution for performance's sake.

[denisecknauer]

I thought that Preact Signals made them popular :D

P.S. Are you planning to add Signals section to your React course on Udemy? :)

[hansschenker]

Signals might become a web standard. Signals are in the web standardization process. That said Rxjs Observables which are also in the web standardization process will probably never become a web standard.

[miro.s]

You should learn how to pause your speech. One sentence is never read throughout several minutes. Really exhausting!