Project Status: playground, STOPPED
A playground repository to reproduce RxJS-like behaviour with as goal to create a fully dynamic dependencyless DOM framework in vanilla JS.
Bad idea to reinvent the RxJS wheel. Working on this codebase was a good learning experience to understand their design choices.
Upon stumbling on issues, the workarounds make you automatically lean towards RxJS paradigms. Reproducing reactive logic would serve as a great lesson for advanced JS students to recognize memory leaks and zombie logic.
The dyn(obj)
syntax is AWESOME. It is very intuitive, but the elephant in the room is that your teardown logic will be inaccessible when Proxying setters using the a = b
syntax. If the object is destroyed, the hooks/mutators (== RxJS subscriptions/pipes) will keep triggering.
Teardown logic can be gathered in the return value of dyn()
. An alternative is to automatically run teardown logic by using either custom elements like <dyn-div>
which have access to HTMLElement lifecycle events or using hacks like animationstart
to derive it from native HTML elements.
In this sandbox, even reactive arguments were supported. It felt like a breakthrough to use them until combining two reactive arguments felt off. If you want to inject two reactive parameters and need them settled, you'd need to merge them beforehand and pass them as fn(...arguments)
, which will require some
Plain HTML starts to feel outdated. Where are the reactive programming languages? (angular somewhat solved it)
Might come back to this later, but limitations of HTML5 let me down a bit too much to be sure.