Are reactive updates based on deep equality or reference equality?
It is based on ref. equality, so assignment through '=' will trigger an "effect".
Show HN: Mador – Make any DOM reactive with a tiny 80-line Proxy state tuple
11–20 of 37 posts
Re: Show HN: Mador – Make any DOM reactive with a tiny 80-line Proxy state tuple
#12There are many standalone plug-n-play implementations of the signal primitive in JS. To name a few: preact/signals, vue reactivity, etc, there's even a TC39 proposal for a lang feature. Is this meant to stand out by doing things differently or reinvent them?
Re: Show HN: Mador – Make any DOM reactive with a tiny 80-line Proxy state tuple
#13Proposed variant optimised for human readaiblity... ```js import mador from "mador"; const [read, write] = mador({ count: 1 }); read(".counter", ctx => ctx.el.textContent = ctx.count); write(".increment", "click", ctx => ctx.count++); write(ctx => ctx.count = 0); ``` ## Read Dependencies are detected automatically when the read function is run during initiation. ```js read(".counter", ctx => ctx.el.textContent = `Cou…
O yes, thanks, appreciate it!
I'm tired now, but i will find the time tomorrow to make it more readable!
Re: Show HN: Mador – Make any DOM reactive with a tiny 80-line Proxy state tuple
#14There are many standalone plug-n-play implementations of the signal primitive in JS. To name a few: preact/signals, vue reactivity, etc, there's even a TC39 proposal for a lang feature. Is this meant to stand out by doing things differently or reinvent them?
Honestly, mostly for the fun of building it and seeing how small and simple I could make it. While big solutions like Preact or Vue are great, sometimes you just want a tiny zero-dependency script without the overhead.
And it turned out to be quite nice as I may say so
Re: Show HN: Mador – Make any DOM reactive with a tiny 80-line Proxy state tuple
#15> Hey HN! I wanted to see how far you can push modern JavaScript Proxies without all the heavy overhead of a traditional framework. The result is Mador: a tiny ~80-line reactive state tuple ([r, w]) that lets you make any DOM element reactive using a simple CSS selector, automated dependency tracking, and batched microtasks. No build steps required—just drop it in. I built this over the weekend just to experiment with clean, zero-dependency reactivity. Would love to hear your thoughts or see where you'd run into limits with something like this!
Unsure why this comment from the author was flagged/dead but it certainly doesn’t seem to run afoul of HN guidelines.
Re: Show HN: Mador – Make any DOM reactive with a tiny 80-line Proxy state tuple
#16There are many standalone plug-n-play implementations of the signal primitive in JS. To name a few: preact/signals, vue reactivity, etc, there's even a TC39 proposal for a lang feature. Is this meant to stand out by doing things differently or reinvent them?
Honestly, mostly for the fun of building it and seeing how small and simple I could make it. While big solutions like Preact or Vue are great, sometimes you just want a tiny zero-dependency script without the overhead. And it turned out to be quite nice as I may say so
preact/signals-core has 0 dependencies, your project could also benefit from mentioning what primitive is being implemented for the reader's information. The size difference is negligible. The readme creates a false dilemma where there's either Mador or "having to use a framework" but it hasn't been the case for ages - as I mentioned above the major frameworks have decoupled versions of their reactivity available. This makes the other reply where "the frontend community deserves tools like this" sound weird because it ignores the great tools that have been available for a while.
Good learning experience but a very weird presentation.
Re: Show HN: Mador – Make any DOM reactive with a tiny 80-line Proxy state tuple
#17Earlier quoted context omitted.
Honestly, mostly for the fun of building it and seeing how small and simple I could make it. While big solutions like Preact or Vue are great, sometimes you just want a tiny zero-dependency script without the overhead. And it turned out to be quite nice as I may say so
preact/signals-core has 0 dependencies, your project could also benefit from mentioning what primitive is being implemented for the reader's information. The size difference is negligible. The readme creates a false dilemma where there's either Mador or "having to use a framework" but it hasn't been the case for ages - as I mentioned above the major frameworks have decoupled versions of their reactivity available. Th…
That's a fair distinction, but I think they solve different problems. Signals are great, but they usually require managing primitives individually and don't map directly to deep, nested JS objects the same way. Mador is specifically about dropping in a plain, nested object and working with it like normal JS without .value "boilerplate".
Appreciate the feedback on the README phrasing though—I'll tweak it so it doesn't sound like a false dilemma!
Re: Show HN: Mador – Make any DOM reactive with a tiny 80-line Proxy state tuple
#18Earlier quoted context omitted.
Thanks, I really appreciate it! Hope others will feel the same. The frontend community needs and deserves simple tools:)
This makes me think of a version of that comic where in the last pane, you get thrown out the window for suggesting such a sensible thing.
Hahaha! Exactly
Re: Show HN: Mador – Make any DOM reactive with a tiny 80-line Proxy state tuple
#19There are many standalone plug-n-play implementations of the signal primitive in JS. To name a few: preact/signals, vue reactivity, etc, there's even a TC39 proposal for a lang feature. Is this meant to stand out by doing things differently or reinvent them?
Honestly, mostly for the fun of building it and seeing how small and simple I could make it. While big solutions like Preact or Vue are great, sometimes you just want a tiny zero-dependency script without the overhead. And it turned out to be quite nice as I may say so
First time I’ve seen Preact described as a “big solution”!
Re: Show HN: Mador – Make any DOM reactive with a tiny 80-line Proxy state tuple
#20I’m curious to know what performance looks like. In the recesses of my memory is the belief that proxies are not good for performance but I have no idea if that’s well founded (or maybe once was but isn’t any more).
It’s a very smart idea though, I like it.