Пришли из React или Vue и ничего не складывается? Прочтите сначала Ментальную модель: пять минут о том, куда делись computed, watch, хуки жизненного цикла и загрузка данных.
$mol — это реактивный UI-фреймворк, где вы описываете, что представляет собой интерфейс, а фреймворк сам решает, как и когда его обновлять. Никакого виртуального DOM, ручных подписок и useEffect. Вы описываете компоненты деревом; $mol рендерит только видимое и пересчитывает только то, что действительно изменилось.Компонент состоит из трёх файлов:name.view.tree — декларативная разметка (компактный древовидный язык)name.view.ts — поведение (обычные классы TypeScript)name.view.css.ts — типизированные стили (проверяются компилятором)В этом разделении и заключается вся идея: разметка остаётся читаемой, логика — тестируемой, стили — типобезопасными.Обязательного среди трёх нет ни одного. Дерево — сокращение для структуры, которую можно написать и руками: От TypeScript к view.tree собирает один компонент обоими способами и показывает код, в который дерево компилируется.
Вам нужно небольшое приложение, которое остаётся небольшим по мере роста — рантайм компактный, а рендеринг по умолчанию виртуализирован.Вы любите типы повсюду — даже стили проверяются TypeScript.Вы устали связывать реактивность вручную — состояние в $mol реактивно автоматически, как в электронной таблице.
Счётчик целиком: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 реактивен: всё, что его читает, перерисовывается автоматически при изменении. Нет ни setState, ни массива зависимостей, ни стора, который нужно регистрировать.
