DEV Community


Discussion on: A Hands-on Introduction to Fine-Grained Reactivity

drsensor profile image

Do you know any framework/libs that use this signature

interface Signal<State> {
  () => State
  set(val: State): void
function createSignal<T>(s: T): Signal<T>
Enter fullscreen mode Exit fullscreen mode

which the usage is something like

const state = createSignal(0)
// read a value
console.log(state()) // 0

// set a value
console.log(state()) // 5
Enter fullscreen mode Exit fullscreen mode
Thread Thread
ryansolid profile image
Ryan Carniato Author

Actually no. The single function and the separate get/set are by far the most common. The tuple that I use is super uncommon in JavaScript in reactive libraries except maybe some newer ones in React.

This was one of the ones I was super leaning towards the month before hooks came out. I was worried it was too clever using the function as the object to hang it off of. We used to use this pattern in KnockoutJS a reasonable amount of the time to add augmented properties. Generally, it was for attaching other observables and was called sub-observables. I found while teaching that to newcomers they found it weird.

What I liked was it was minimal. It only creates the 2 functions. Syntaxtually it kept the common case easy (get) and let you be explicit on sets. No weird doubling up, and about as minimal syntax. You would still name the variable as you like.

I'm not sure if I'd have landed on it over the MobX style but now looking back at it I would think I wouldn't have hesitated on that API if I hadn't seen hooks. I only came to respect the read/write split after I started using it. As I started playing with composition patterns and reading more academic papers.