How does it all work?

[Dimev]

Hello!
I'm trying to understand how exactly solid works internally, by making a tiny solidjs clone.

My naive understanding is that a signal keeps track of a set of subscribers, which it runs when the value is updated.
Then when an effect runs, it sets some global variable to indicate it is running, so that any signal whose value is read knows to add it to it's subscriber list.

Looking at the code for signal, this seems to be somewhat correct, but there's a lot more going on that I don't understand, such as the scheduler.
There's also Array which to me seems to implement a form of diffing algorithm to track changes there.

I'm also stuck on understanding how rendering works. From what I understand, the first time all elements are created, then insert is called to insert them into the DOM + hook up the reactive values. I'm mostly stuck on figuring out how it then hooks up the reactive values. I guess if a function is passed as a property/node instead of a concrete value, an effect is set up to modify that value when a signal modifies it?

Is my understanding partially correct? What am I still missing?

Thanks!

[atk]

There's a babel plugin that translates JSX to templates and effects that keep dynamic values updated.

[Dimev]

How does that work tho? What exactly does it translate to?

[this-spring]

I am also interested in this issue. We can add a contact information to communicate.~

[Dimev]

I'd prefer it to stay public here, then it's more useful for other people as well.