‏Vidact؛ ری‌اکتی که به VanillaJS کامپایل می‌شه

Vidact کامپوننت‌های تابعی ری‌اکت رو موقع build می‌خونه و به جای اینکه یه رانتایم بزرگ همراه اپ بفرسته، خودش کد DOM رو می‌نویسه. مدل ذهنیش اینه: بدنهٔ کامپوننت فقط یه بار، موقع mount، اجرا می‌شه. بعد از اون هر setState فقط به همون text nodeها و attributeهایی می‌رسه که اون state رو می‌خونن، پس نه کامپوننت دوباره صدا زده می‌شه و نه درختی diff می‌شه. کدی که می‌نویسی همون ری‌اکت معمولیه:

export function Counter() {
  const [count, setCount] = useState(0)
  return (
    <div>
      <button onClick={() => setCount(count + 1)}>Increment</button>
      <output>Count: {count}</output>
    </div>
  )
}

دور و بر کامپایلر یه فریم‌ورک هم هست به اسم Vidact Start که file route، لودر سمت سرور، SSR، هیدریشن (یعنی وصل کردن رویدادها به HTMLی که سرور فرستاده) و ناوبری سمت کلاینت رو اضافه می‌کنه. نکته‌ش اینه که همون یه کامپایلر، هم بیلد سرور رو می‌سازه هم بیلد مرورگر رو؛ پس مارک‌آپی که سرور می‌فرسته و DOMی که کلاینت هیدریت می‌کنه از یه توصیف واحد از کامپوننت میان. برای اندازه هم عدد داده: یه شمارنده با رانتایم ۸ کیلوبایت و TodoMVC حدود ۱۱.۸ کیلوبایت gzip‌شده.

در عوض یه چیزایی رو قبول نمی‌کنه: کامپوننت‌های کلاسی، createRef، بیشتر هلپرهای Children و React DevTools بیرون از این زیرمجموعه‌ن. هر پکیج شخص ثالثی هم که به جای سورس React-شکل، بیلد از پیش کامپایل‌شده روی رانتایم ری‌اکت می‌فرسته پشتیبانی نمی‌شه. هیچ‌کدوم اینا بی‌صدا خراب نمی‌شن؛ کامپایلر همون‌جا بیلد رو با اسم API و شمارهٔ خط متوقف می‌کنه و هیچ مسیر fallbackی هم نداره که به جاش خود React رو لود کنه.

نکات کلیدی:

• بعد از mount هیچ فراخوانی دوبارهٔ کامپوننت و هیچ diff درختی انجام نمی‌شه
• شمارندهٔ نمونه با رانتایم ۸ کیلوبایت و TodoMVC حدود ۱۱.۸ کیلوبایت gzip‌شده‌ست
• فقط زیرمجموعهٔ مستندشده‌ای از React 19 پشتیبانی می‌شه و بقیه موقع build رد می‌شن
• کامپوننت کلاسی، createRef، اکثر هلپرهای Children و React DevTools پشتیبانی نمی‌شن
• Vidact Start ناوبری کلاینت، file route، لودر سرور، SSR و هیدریشن رو اضافه می‌کنه
• پروژه فعلاً تو مرحلهٔ بتاست