از React یا Vue میآیید و هیچچیز جور درنمیآید؟ اول مدل ذهنی را بخوانید: پنج دقیقه دربارهٔ اینکه computed، watch، قلابهای چرخهٔ عمر و بارگذاریِ داده کجا رفتهاند.
$mol یک فریمورک واکنشگرای رابط کاربری است: شما توصیف میکنید که رابط چیست، و فریمورک تشخیص میدهد که چگونه و چه زمانی آن را بهروزرسانی کند. نه DOM مجازی، نه اشتراکهای دستی، نه useEffect. شما کامپوننتها را بهصورت یک درخت مینویسید؛ $mol تنها آنچه را که دیده میشود رندر میکند و تنها آنچه را که واقعاً تغییر کرده دوباره محاسبه میکند.هر کامپوننت از سه فایل تشکیل شده است:name.view.tree — چیدمان اعلانی (یک زبان درختی فشرده)name.view.ts — رفتار (کلاسهای سادهی TypeScript)name.view.css.ts — سبکهای نوعدار (که کامپایلر بررسی میکند)همین جداسازی، تمام ایده است: چیدمان خوانا میماند، منطق قابل آزمون میماند، و سبکها از نظر نوع ایمن میمانند.هیچکدام از این سه بهتنهایی اجباری نیست. درخت کوتهنوشتی برای ساختاری است که میتوانید دستی هم بنویسید: از تایپاسکریپت به 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ای هست، نه آرایهی وابستگی، و نه storeای که باید ثبت شود.