Arrivi da React o Vue e niente ha senso? Leggi prima Modello mentale: cinque minuti su dove sono finiti computed, watch, gli hook del ciclo di vita e il caricamento dei dati.
$mol è un framework di interfaccia reattivo: descrivi cosa è l'interfaccia e il framework capisce come e quando aggiornarla. Nessun DOM virtuale, nessuna sottoscrizione manuale, nessun useEffect. Scrivi i componenti come un albero; $mol renderizza solo ciò che è visibile e ricalcola solo ciò che è realmente cambiato.Un componente ha tre file:name.view.tree — il layout dichiarativo (un linguaggio ad albero compatto)name.view.ts — il comportamento (semplici classi TypeScript)name.view.css.ts — gli stili tipizzati (controllati dal compilatore)Questa separazione è l'idea centrale: il layout resta leggibile, la logica resta testabile, gli stili restano type-safe.Nessuno dei tre è obbligatorio da solo. L'albero è un'abbreviazione per una struttura che puoi anche scrivere a mano: Da TypeScript a view.tree costruisce lo stesso componente in entrambi i modi e mostra il codice in cui l'albero compila.
Vuoi un'app piccola che resti piccola mentre cresce — il runtime è compatto e il rendering è virtualizzato per impostazione predefinita.Ti piacciono i tipi ovunque — persino gli stili sono controllati da TypeScript.Sei stanco di cablare la reattività a mano — lo stato in $mol è automaticamente reattivo, come un foglio di calcolo.
Un contatore, per intero:1$my_counter$mol_view2 sub /3<= Count $mol_view4 sub /<= count \5<= Increment $mol_button6 click?<=> increment?7 sub /<= label \+1namespace $.$${2export class $my_counterextends$.$my_counter{3@ $mol_memcount(){return 0}4@ $mol_actionincrement(){this.count(this.count()+1)}5}6}count è reattivo: tutto ciò che lo legge viene ri-renderizzato automaticamente quando cambia. Nessun setState, nessun array di dipendenze, nessuno store da registrare.
