5 ms·
Signals, the push-pull based algorithm
- danieltanfh95 6mo agoHow is error handling expected to happen here?
- nothinkjustai 6mo agotry-catch
- tcfhgj 6mo agoResult<T> should work
- ramon156 6mo agoI love this pattern, but I always felt like squeezing idiom B into idiom A when doing this in e.g. TS. I never tried effect-ts, so maybe I'm missing out. Anyone have experience in this?
- fabianholzer 6mo agoI do not want to distract from the content of the article, which is highly relevant for folks who built UIs with frameworks that are conceptually based on signals, but the way that the reading experience is designed really great, in particular the guided reading flow through the instructive code path is something that I rarely have seen done at all, and this even works pretty well on mobile. It's a delightful reminder on how a dynamic medium can be more than the simulation of print on screens.
- willybrauner 6mo agoI searched for the "right way" to explain this algorithm, and ultimately parsing the code was the clearest for me. This isn't always true; sometimes a graph or an interactive module has more impact; it really depends on the topic. Thanks for the feedback.
- qprofyeh 6mo agoKudos! Minor detail: the code could use a border or bg color different than the text, so that they’re more distinct.
- noelwelsh 6mo agoOverall, very nice article. A few notes: * I think the first implementation in JS land was Flapjax, which was around 2008: https://www.flapjax-lang.org/publications/ https://www.flapjax-lang.org/publications/ * The article didn't discuss glitch-freedom, which I think is fairly important.
- HumanOstrich 6mo agoAfter wondering what the heck glitch-freedom is and learning about it, I agree with you. It seems like it deserves at least a brief explanation in an article about how signals work. I've gone with the universal `alien-signals` package for my project (which doesn't use a frontend framework that includes signals). They show benchmarks of being by far the fastest and have strict limits on code complexity. Those limits are also supposed to avoid glitches by design, and now at least some of that is tested[1]. [1]: https://github.com/stackblitz/alien-signals/pull/39 https://github.com/stackblitz/alien-signals/pull/39
- willybrauner 6mo agoI didn't know about Flapjax, thanks I'll check it out. Glitch-freedom is indeed a gap in this article. I focused on the signal algorithm exclusively without some implementation optimisation like batching updates; there is so much more to cover! Maybe in a next one, Thanks!
- mpweiher 6mo agoAnd before there was "reactive", there were (oneway) dataflow constraints. And a lot of literature on the algorithms. I wrote a bit about the connection here: https://blog.metaobject.com/2014/03/the-siren-call-of-kvo-and-cocoa-bindings.html https://blog.metaobject.com/2014/03/the-siren-call-of-kvo-an... (It starts in a slightly different place, but gets there) Also about constraints as an architectural connector. https://dl.acm.org/doi/10.1145/2889443.2889456?cid=81316491227 https://dl.acm.org/doi/10.1145/2889443.2889456?cid=813164912...
- pygy_ 6mo agoBatching isn't just an optimisation, not having transactional semantics can cause bugs.
- cloogshicer 6mo agoWhat an amazing article. I really like the presentation of text scrolling together with the code. Wonder how this is done under the hood.
- willybrauner 6mo agoThanks a lot! The left column containing the text is sticky, The right column is absolute and translate on Y and depend on an intersection observer triggered by each scroll section from the left.
- cloogshicer 6mo agoSuper cool, thanks for explaining! Is the code available somewhere?
- willybrauner 6mo agoNo, unfortunately, my website is not open source. I may consider externalizing the blog in the future, while keeping all the internal article modules.
- rienbdj 6mo agoSodium (and the book that goes with it) is a great resource too https://github.com/SodiumFRP/sodium https://github.com/SodiumFRP/sodium
- cmacleod4 6mo agoNice presentation, looks like the same thing I implemented in Tcl here: https://wiki.tcl-lang.org/page/ReacTcl https://wiki.tcl-lang.org/page/ReacTcl :-)
- Morpheus_Matrix 6mo ago[dead]
- Tade0 6mo agoNow that Angular is adopting signals, building in it has become a much better experience. Mind you, the framework still has a hostile learning curve, but for those who already made that investment, it's a boon.
- esafak 6mo agoAlso in https://svelte.dev/blog/runes https://svelte.dev/blog/runes
- eviks 6mo agoThe visual examples are rather misleading: The "2 * x" is rather - why would the reaction from a change in X display many gradual increments of 1 instead of showing the final value once? And then why does Z =Y+1 instead of +1 to Y repeats all the steps again from X? That's not how real signal frameworks work, and also not how you'd imagine they should work Then the next cascading example: ok, if Signal is a button, not the underlying mechanism behind it, then "computed 1" is also a signal, why isn't it called that? (though intuitively you'd think the moving dots are signals, not buttons)
- mockingloris 6mo agoBeautiful presentation... @willybrauner, I would like to read your spin on a follow-up piece on `glitch-freedom`. But in all honesty, this journal entry/post is a work of art; a testament to your journey as a technologist!. Cheers
- willybrauner 6mo agoWriting technical articles without adding a graphic and playful touch would indeed interest me less. I find that it's the intersection of these two worlds that makes reading enjoyable. Thanks for your kind words!
- tubs 6mo agoWhy create an array each time it iterates a Set rather than just iterating the Set?
- willybrauner 6mo agoI create a new copy of the Set because the functions called during the loop might modify it by removing elements via cleanup functions. Without a copy, iterating directly on the Set could cause unpredictable behavior.
- willybrauner 6mo agoBut as the article points out, this is a naive implementation. It could be discussed and greatly improved.
- deleted 6mo ago[deleted]
- ByteMe95 6mo agoRelevant project for reactive stream programming that gets overlooked https://github.com/Point72/csp https://github.com/Point72/csp
- dunham 6mo agoI know it is out of scope for this article, but there are variants where the operations are monadic rather than applicative and the shape of the graph can change depending on values. And also variations with state - where history can be taken into account. Jane street briefly summarizes some options here: https://blog.janestreet.com/breaking-down-frp/ https://blog.janestreet.com/breaking-down-frp/ And they have an interesting talk on the trade-offs and how their own system, incremental, evolved: https://blog.janestreet.com/seven-implementations-of-incremental/ https://blog.janestreet.com/seven-implementations-of-increme...
- deleted 6mo ago[deleted]
- BobbyTables2 6mo agoThe writeup is written very well. Kudos! However, I really wonder if this scales to real applications… I’ve seen too many people get initially mesmerized by “event driven” programming only to find the system eventually becomes a steaming mess that nobody can comprehend or debug. Or it manages to work but has serious performance issues (in an exclusively “push” design)… Maybe in a single process, single threaded environment, it is more difficult to screw up?