リアクティブなマイクロモジュール

$mol — リアクティブなマイクロモジュールフレームワーク

リアクティビティはフレームワークの土台に組み込まれていて、後付けではありません。依存配列、手動の購読、手動のキャッシュ無効化、エフェクトのクリーンアップ — どれもここには存在しません。簡単になったのではなく、不要になったのです。はじめるプレイグラウンドを試す $mol とはview.tree$my_hello $mol_view guest \stranger sub / <= Name $mol_string value? <=> name? \mol hint @ \Type a name <= Greeting $mol_paragraph title <= greeting \view.tsclass $my_hello extends $.$my_hello { greeting() { return `Hello, ${ this.name() || this.guest() }!` }}view.css.tsnamespace $ { $mol_style_define( $my_hello, { gap: $mol_gap.block, flex: { direction: 'column' }, Greeting: { font: { size: '2rem', weight: 600 }, }, } )}→ライブHello, mol!ファイルは 3 つ、マークアップとロジックとスタイル。この例を試すミニマル段階的に導入できるエコシステム。単一コンポーネントからフルスタックの local-first アプリまでスケールします。最適UI をコンポーネントのツリーとして構築。リアクティビティは自動、副作用は明示的です。レイジー完全なレンダリング仮想化 — ビューポート外のコンポーネントは存在すらしません。構造

はじめからマイクロモジュール構成

プロジェクトはフォルダ、フォルダはリポジトリ、そしてフレームワークはコードの中ではなく隣に置かれます。最初のコンポーネントでも、三十個の案件を抱える会社でも、置き方は同じです。mam/ ワークスペース├── .meta.tree レジストリ├── mol/ フレームワーク└── my/ あなたのパッケージ ├── my.meta.tree あなたのレジストリ └── hello/ あなたのプロジェクト ├── index.html エントリポイント └── hello.view.tree マークアップ自分のプロジェクトまで五歩1MAM を一度クローンします。すべてのプロジェクトはこのワークスペースの中にあります。git clone https://github.com/hyoo-ru/mam.git2自分用に短い名前のフォルダを作り、リポジトリとして公開します。mam/my/3その隣に、自分のプロジェクトのレジストリを置きます。my/my.meta.tree4その中にプロジェクトを作り、専用のリポジトリを与えます。my/hello/5登録すれば、新しいチェックアウトが名前で取得してくれます。pack hello git \https://github.com/you/hello.gitプロジェクトが自分のリポジトリを持つ理由プロジェクトの構成比較1つのシナリオを、React・Vue・$mol で並べて、あなた自身のブラウザでその場で動かします。比較を開くまずは $mol vs React から