Svelte یک فریمورک ساده است که استفاده از آن آسان است و آخرین تغییرات آن باید حتی آن را آسان تر کند.
در ژوئن 2023، Svelte جدیدترین نسخه پایدار خود، نسخه 4 را اعلام کرد. به روز رسانی Svelte 4 در اصل یک نسخه تعمیر و نگهداری از Svelte 3 است که هدف آن فراهم کردن زمینه برای عرضه نسل بعدی Svelte به عنوان Svelte 5 است.
Svelte 4 بهبودهای مختلفی را به اکوسیستم Svelte اضافه می کند، از جمله طراحی مجدد وب سایت، تنظیم انتقال محلی به عنوان پیش فرض، بهبود پشتیبانی از اجزای وب و تغییر از TypeScript به JSDoc.
1. طراحی مجدد سایت Svelte
Svelte 4 همراه با بهبودهایی به وب سایت رسمی Svelte رسید. ظاهر جدید سایت فوق العاده است، با اسناد TypeScript بهبود یافته، گزینه حالت تاریک، و به طور کلی تجربه کاربری بهبود یافته در دستگاه ها.
سایت Svelte اکنون دارای یک REPL پیشرفته است که به شما امکان می دهد کد Svelte را مستقیماً در مرورگر آزمایش کنید.
همچنین، همه پیوندهای آموزشی Svelte اکنون به تجربه جدید یادگیرندگان Svelte اشاره می کنند، در حالی که آموزش های قدیمی برای کاربران Safari 16.3 و نسخه های قبلی در دسترس است.
2. انتقال های محلی پیش فرض هستند
تجربه دردناکی را تصور کنید که مجبور هستید پس از تماشای بارگذاری صفحه خود برای مدت طولانی‌تر از حد انتظار به دلیل استفاده از انتقال Svelte، به انتقال CSS رضایت دهید.
معمولاً زمانی که یک بلوک والد را از بین می‌برید، یک انتقال اجرا می‌شود. می توانید این رفتار را با اصلاح کننده | محلی لغو کنید. این باعث می شود که انتقال تنها زمانی اجرا شود که بلوک حاوی جزء هدف را از بین ببرید. در Svelte 4، این اصلاح کننده | محلی به عنوان پیش فرض برای انتقال ها تنظیم شده است.
در قطعه زیر، یک انتقال اسلاید به صورت محلی به عنصر div اضافه شده است:
<div transition:slide|local> {item}</div>
3. پشتیبانی از اجزای وب بهبود یافته
Svelte همیشه قابلیت استفاده مجدد و قابلیت نگهداری را ترویج کرده است، از این رو پشتیبانی مداوم آن از اجزای وب است. اجزای وب به شما امکان می دهد عناصر HTML سفارشی قابل استفاده مجدد را با سبک ها و رفتارهای تزریقی ایجاد کنید.
Svelte 4 روش تولید اجزای وب را تغییر می دهد و باگ ها و ناسازگاری ها را حذف می کند. این تغییرات عبارتند از:
- Export یک تکیه گاه کامپوننت ایجاد می کند و آن را برای مصرف کنندگان جزء قابل دسترسی می کند.
- تکالیف واکنشی هستند. برای تغییر وضعیت یک مؤلفه و راه‌اندازی رندر مجدد، آن را به یک متغیر اعلام شده محلی اختصاص دهید.
- از نماد $ در ابتدای دستور استفاده کنید تا آن را به عنوان یک عبارت واکنشی علامت گذاری کنید. هر زمان که مقادیر وابسته تغییر کند، دستورات واکنشی پس از سایر کدهای اسکریپت و قبل از رندر کردن نشانه گذاری مؤلفه اجرا می شوند.
- هنگام ایجاد اشیاء فروشگاه، پیشوند فروشگاه را با $ قرار دهید تا امکان دسترسی واکنشی به یک مقدار فراهم شود.
- تنظیم ویژگی متن تگ اسکریپت به ماژول باعث می شود که اسکریپت یک بار در هنگام ارزیابی ماژول به جای هر نمونه جزء اجرا شود.
4. حرکت از TypeScript به JSDoc
JSDoc یک ابزار مستندسازی است که از افزودن یادداشت‌ها و نظرات به کدهای جاوا اسکریپت پشتیبانی می‌کند.
با توجه به اینکه JSDoc توسعه‌دهندگان را فریب می‌دهد تا کدهایشان را مستند کنند، هدف این مهاجرت تشویق بیشتر توسعه‌دهندگان Svelte است تا عادت به مستندسازی صحیح کدهایشان را ایجاد کنند. یک پایگاه کد جاوا اسکریپت مستند به اندازه کافی نیاز به بررسی نوع کمی دارد یا اصلاً بررسی نمی کند.
اگر در تایپ اسکریپت تازه کار هستید، باید تایپ اسکریپت را کاوش کنید و بدانید چرا توسعه دهندگان آن را ترجیح می دهند.
مهاجرت به Svelte 4
Svelte 4 دارای عملکرد بهبود یافته و توسعه ساده است که برای ساخت برنامه های کاربردی وب با کارایی بالا بسیار عالی است. این نسخه جدید همچنین باید مستندات کد بهتر را با انتقال به JSDoc تشویق کند.
Svelte همچنان به پیشرفت خود ادامه می دهد، و در حالی که این چارچوبی نیست که هر توسعه دهنده با آن آشنا باشد، کسانی که آن را به شدت تحسین می کنند.