DEV Community

Discussion on: Should I write a new JavaScript framework?

Collapse
 
oxharris profile image
Oxford Harrison

You might find the Reactive Contexts Proposal for JavaScript very interesting.
Over here: github.com/webqit/subscript.

I got on that work to explore the possibility of having reactivity as part of the JavaScript language. You'd realise that we've stretched JavaScript in all directions to speak "reactivity"! Speaking it natively should be all that makes sense now.

Collapse
 
ninjin profile image
Jin

Another way without syntax changing: AutoWire Proposal.

Collapse
 
drsensor profile image
૮༼⚆︿⚆༽つ

Thanks. I only skim the explainer and have 2 question.

  1. Why name it thread? Shouldn't that make it ambiguous with multi-threading 🤔
  2. Does async function inside subcript function will do automatic tracking? AFAIK in async effect, automatic tracking only happen before await syntax. All reactive variable will not get tracked after await syntax.

References:

Thread Thread
 
oxharris profile image
Oxford Harrison • Edited

Valid questions!

  1. In hind sight... thread() shouldn't be the best name for that function! I raised the first issue myself here: #5. Funny!

Thankfully, that should be only a name change! And it's entirely open to inputs, should you have something in mind! I once used the following reactive/react paradigms:

reactive function render() {
    // Function body
    console.log(externalVariable);
}
// Do first run
render();
Enter fullscreen mode Exit fullscreen mode
// Change externalVariable
externalVariable = newValue;
render.react( ['externalVariable'] );
Enter fullscreen mode Exit fullscreen mode

That is in hopes that react() sounds better, being that what it does is really to let the function react to its external dependencies!

  1. I might need more clarity on the particular question. But inside of Subscript Function is a great Automatic Dependency Tracking system - but this time - based on a compiler-generated Dependency Graph. (Here, calls to react() actually execute along the relationships in this Dependency Graph. And the chain of statements executed is called a dependency thread.)

Talking about async/await... Subscript functions could be async functions...

reactive async function render() {
    // Function body
    let result = await fetch(externalVariable).then(response => response.json());
    console.log(result);
}
// Do first run
render(); // Promise
Enter fullscreen mode Exit fullscreen mode
// Change externalVariable
externalVariable = newValue;
render.react( ['externalVariable'] ); // Promise
Enter fullscreen mode Exit fullscreen mode

Now, on the above update, the console.log() expression only executes after the await fetch() expression resolves - as it would normally!

Code inside Subscript Functions do not change runtime expectations.

Some comments have been hidden by the post's author - find out more