Good learning experience but a very weird presentation.
preact/signals-core is great, but since HTML elements have no way to subscribe to signals, you have to handle that yourself:
import { signal, effect } from "@preact/signals-core";
const $ = (s) => document.querySelector(s);
const counter = signal(0);
effect(() => {
$('.counter').textContent = counter.value;
});
$('.increment').addEventListener('click', () => {
counter.value += 1;
});
vs mador:
import mador from "https://cdn.jsdelivr.net/npm/@marsbos/mador@latest/dist/mador.js";
const $ = (s) => document.querySelector(s);
const [read, write] = mador({
count: 0,
});
read(".counter", (el, count) => {
el.textContent = count;
},
(state) => state.count,
);
$('.increment').addEventListener('click', () => {
write((state) => { state.count++; });
});
Honestly, this seems pretty nifty. Most projects I'd do today would likely have more value in Vue as a whole, and it's nice to see these kinds of things exposed and standalone bits
[1] https://github.com/vuejs/core/tree/main/packages/reactivity/...
So while Vue is not gatekeeping their reactive primitive library, they aren't exactly advertising it like Preact in a way that the average library author (like Mador's author) might even be aware of it.
Also as someone who has built React applications for more than 7+ years, I'm also still not sure what React's reactive primitive package is. Googling or asking ChatGPT has turned up nothing.