معرفی کتابخانه SolidJS

سالید جی اس (Solid JS) مانند React JS یک کتابخانه Javascript برای ایجاد رابط کاربری در برنامه های وب است. از DOM مجازی استفاده نمی کند. مشابه Svelte ، دارای کامپایلری است که قالب ها را به گره های DOM واقعی کامپایل می کند و به روز رسانی ها را در واکنش های ریز پیچیده می کند. این باعث می شود یک برنامه وب به شدت بهینه سازی شده ، فوق العاده سبک و بسیار سریع داشته باشیم. به لطف رویکرد کامپایلر خود ، Solid می تواند به راحتی از ویژگیهای معروف React مانند Context ، Portals ، Fragments و موارد دیگر بدون قربانی کردن اندازه برنامه (کامپایل کردن فقط آنچه که شما استفاده می کنید) یا عملکرد پشتیبانی کند.

سریع و سبک ترینه

اکنون بیش از یک سال است که در صدر معیار JS Frameworks قرار دارد. این شامل پیشی گرفتن از سریع‌ترین پیاده‌سازی‌های Web Assembly در سطح پایین می‌شود. Solid هم اکنون سریعترین روی سرور نیز است. در رابطه با حجم هم باید به شما بگویم که حجم اولیه Solid JS کلا 11.1 کیلوبایت است.

به بهترین نحو کار میکند

برنامه های Solid JS با استفاده از جاوا اسکریپت (TypeScript) و JSX ساخته می شوند. کامپایلر فقط JSX را بهینه می کند. این بدان معنی است که شما زبان کامل را در اختیار دارید. شما محدود به Helper ها و Directive های از پیش ساخته نیستید تا نحوه نمایش نمای خود را کنترل کنید. برای مثال در Vue JS برای استفاده از حلقه ها از v-for استفاده میکنید ولی در Solid JS کامپوننتی به نام For داریم ، نحوه کار کردن For در Solid JS را دوست ندارید ؟ مشکلی نیست خودتان بسازید.

سالید جی اس هنوز خود را یک کتابخانه می داند تا یک فریمورک ، بنابراین شما نمی توانید هر چیزی را که ممکن است در Angular باشد در Solid JS پیدا کنید. با این حال، Solid از اکثر ویژگی‌های React مانند Fragments، Portals، Context، Suspense، Error Boundaries، Lazy Components، Rendering، Implicit Event Delegation، SSR و Hydration پشتیبانی می‌کند (اگرچه هنوز معادل Next.js وجود ندارد). از چند چیز که هنوز در React وجود ندارد مانند Suspense for Async Data Loading و Streaming SSR with Suspense پشتیبانی می کند.

بسیار آشناست

import { createSignal, onCleanup } from "solid-js";
import { render } from "solid-js/web";

const CounterComponent = () => {
const [count, setCount] = createSignal(0),
timer = setInterval(() => setCount(c => c + 1), 1000);
onCleanup(() => clearInterval(timer));

return <div>{count()}</div>;
};

render(() => <CounterComponent />, document.getElementById("app"));

اگر قبلا با React JS کار کرده باشید کار کردن با Solid JS بسیار ساده و طبیعی میباشد ، همان ویژگی ها با همان حالت های قبل ، تشکیل شده از کامپوننت ها و هوک ها. Solid SJ از همان فلسفه React با جریان داده های یک طرفه، جداسازی خواندن/نوشتن و رابط های غیرقابل تغییر پیروی می کند. فقط یک پیاده سازی کاملاً متفاوت دارد که از استفاده از DOM مجازی صرف نظر می کند.

از Solid JS استفاده کنیم ؟

این معامله واقعی است. Solid بیش از 4 سال است که در حال توسعه است. اما در مورد جامعه و اکوسیستم هنوز در مراحل اولیه است. امیدوارم موافق باشید که پتانسیل بالایی در اینجا وجود دارد. متمایز شدن در یک فضای شلوغ همیشه دشوار است، و بیشتر از آن برای Solid، زیرا در ظاهر خیلی متفاوت به نظر نمی رسد. اما امیدوارم این مقاله به شما بینشی بدهد که چرا Solid JS مخفیانه بهترین کتابخانه جاوا اسکریپت است که تا به حال نام آن را نشنیده اید.

منبع