How to deeply understand Angular signals (...or anything)

One of the best ways to improve as a developer is to take the leap into looking into how things work yourself, and it might be easier than you think. In this video, we explore how signal and computed works in Angular by looking into the source code ourselves, rather than relying on information we might find from other sources.

MY GEAR:

0:00 How to improve
0:40 How does a signal work?
2:01 Creating a signal node
2:38 How a signal knows it has been accessed
3:06 What is a reactive context?
5:12 Using the debugger
6:35 Creating the reactive graph
7:55 How does computed know to update?
9:32 What have we learned?

#angular #signals

[IgorBondarenko]

it's so cool how passionate you are about the topic

[szczepan]

I just did the same deep dive a day before you posted this video. I got overwhelmed by the code but I realized there is no magic here, just a complicated algorithm. Initially I thought there is some compile time transformations to make it work.
These things helped me understand it better:
- Effect signals use zone in some way.
- computed signal functions are not executed on every signal change but only when read and still get correct value
- Computed signals don't depend on every signal they use but only on those that were executed on the last call. That sounds wrong but actually makes sense.
I still don't feel confident with that, so I might have understoos sth wrong 😅 but your video is another small step for me, so thank you

[marlx]

Great deep dive! Would have loved a few visualization though, had to pause quite a bit to understand what's happening, but now I know that Signals are not as magical as I thought.

[julienwickramatunga]

It's so interesting to follow you down to the basement of Angular, seeing your logic unfold file after file!
I hope to see more videos like this one 🙂

[robsonvonbrum]

I love the video, but even after your detailed walkthrough I could not quite get it how it works internally... Guess I need more practice ahaha, but this a great insight and a good habit I will adhere - to try and understand the inner working of things

[wawawawa]

Thanks for the walkthrough! I was just having troubles trying to understand signal's source code earlier today.

[nikunjguna]

Please make detailed video about these so called NODES that you are mentioning in video

[jonathangamble]

Would be cool to see custom minimalist version of this for a video

[MegaMaximonstre]

Love the content of this video and all the previous ones! :)
If would love to have your point of vue on how to comunicate between two services that has to share data.
I'm trying to stick to the angularstart courses, but sometimes it's hard to say what would be the best/preferable approach in complex scenarios.
Thanks a lot!

[shaylevinzon]

Best way by far is to actually look at what the code does
In other languages it's much easier to see the source of the dependencies, but in js its also super valuable

[ziftytodd]

As always, love your videos. Although your pronunciation of consumer as "conshumer" (versus consoomer, like "zoom") took the cake for me! :)

[ngmehdi]

Hello, great video. How did you make the animation at the beginning of the video ??

[turbowagon]

That's the most imperative code I've ever seen you walk through

[ttma]

please please let me know whats ur neovim color theme！ looks so good

[ivanho]

Thanks for the video! You've triggered in me the desire to dive into the code myself to better understand signals :)

The only feedback I could give you is maybe don't hesitate to slow down your explanations? It's overall quite fast and hard to follow. I've had to go back a few times to keep up with your pace :p

[mnemanja]

Bro, this was so difficult to follow... Either you're all just some sort of genius or I need to sleep more

[CodeWithRains]

i am haivng list of items, and at a component i have to pass this from forloop, but using using input i have to convert that item into Signal, but this is the data
i am having a card component where by the loop i am calling the card component and passing the data !! but here i am now stuck becuase it is required to have input Type !!,
now thinging do i have to use @input or go with signal then how

[ancadea]

Could you make a vidoe about hydration and SSR? :)

[smorebytes]

Needed a how many times you say consumer counter =]

[TheSaintsVEVO]

From the video it sounds like “if you already know how it all works, then you can figure how it all works by looking at the source code” like wut