Du kommst von React oder Vue und nichts ergibt einen Sinn? Lies zuerst Mentales Modell: fünf Minuten darüber, wo computed, watch, die Lifecycle-Hooks und das Laden von Daten geblieben sind.
$mol ist ein reaktives UI-Framework: Du beschreibst, was die Oberfläche ist, und das Framework ermittelt, wie und wann sie aktualisiert wird. Kein virtuelles DOM, keine manuellen Abonnements, kein useEffect. Du schreibst Komponenten als Baum; $mol rendert nur das Sichtbare und berechnet nur das neu, was sich tatsächlich geändert hat.Eine Komponente besteht aus drei Dateien:name.view.tree — das deklarative Layout (eine kompakte Baumsprache)name.view.ts — das Verhalten (einfache TypeScript-Klassen)name.view.css.ts — typisierte Styles (vom Compiler geprüft)Diese Trennung ist die ganze Idee: Das Layout bleibt lesbar, die Logik bleibt testbar, die Styles bleiben typsicher.Keine der drei ist für sich genommen Pflicht. Der Baum ist eine Kurzschreibweise für Struktur, die du auch von Hand schreiben kannst: Von TypeScript zu view.tree baut eine Komponente auf beide Arten und zeigt den Code, zu dem der Baum kompiliert.
Du willst eine kleine App, die klein bleibt, während sie wächst — die Runtime ist kompakt und das Rendering ist standardmäßig virtualisiert.Du magst Typen überall — sogar die Styles werden von TypeScript geprüft.Du bist es leid, Reaktivität von Hand zu verdrahten — der Zustand in $mol ist automatisch reaktiv, wie eine Tabellenkalkulation.
Ein Zähler, vollständig: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 ist reaktiv: Alles, was es liest, wird automatisch neu gerendert, wenn es sich ändert. Kein setState, kein Abhängigkeits-Array, kein Store, den man registrieren muss.
