| 👀 خبر در یک نگاه:
React 19.2 منتشر شد و شامل کامپوننت Activity برای کنترل دقیق UI، هوک useEffectEvent برای جدا کردن بخش رویدادی افکت‌ها، cacheSignal برای مدیریت عمر کش در سرور و Partial Pre-Rendering برای رندر جزئی سرور است. همچنین بهبودهای داخلی و پشتیبانی از Web Streams افزوده شده است. |
متا نسخه 19.2 از کتابخانه رابط کاربری React را منتشر کرده که شامل مجموعه‌ای از APIهای جدید، بهبود عملکرد و قابلیت‌های رندر سمت سرور (SSR) است. این به‌روزرسانی، Primitiveهای اختصاصی برای کنترل فعالیت، افکت‌ها و کش سیگنال‌ها را اضافه می‌کند.
ویژگی‌های جدید ری‌اکت 19.2
نسخه 19.2 چند ویژگی اصلی جدید دارد که در این بخش چند مورد را معرفی می‌کنیم.
کامپوننت Activity
کامپوننت Activity به توسعه‌دهندگان اجازه می‌دهد رابط کاربری را به «فعالیت»های نام‌گذاری‌شده تقسیم کنند که می‌توانند به‌صورت شرطی رندر شوند یا موقتا تعلیق شوند.
پیش‌تر ممکن بود توسعه‌دهنده از شرط‌ها برای نمایش یا پنهان کردن یک کامپوننت استفاده کند:
|
1 2 3 4 5 |
{isHidden && ( <Component /> )} |
اما اکنون می‌توان از کامپوننت Activity استفاده کرد:
|
1 2 3 4 5 |
<Activity mode={isHidden ? ‘hidden’ : ‘visible’}> <Component /> </Activity> |
این کامپوننت حالت‌های visible و hidden را پشتیبانی می‌کند و کنترل دقیق‌تری روی بخش‌های UI فراهم می‌کند. Activity به توسعه‌دهندگان اجازه می‌دهد کامپوننت‌ها را پیش‌از نمایش به کاربر رندر کنند و وضعیت آن‌ها در حالت مخفی حفظ شود. تیم React اعلام کرده که در آینده حالت‌های بیشتری به Activity اضافه خواهند کرد.
هوک جدید useEffectEvent
هوک جدید useEffectEvent، مکانیزمی را برای جدا کردن بخش رویدادی از منطق useEffect به یک هوک جداگانه فراهم می‌کند. این قابلیت زمانی مفید است که یک افکت از یک مقدار (value) استفاده می‌کند اما نباید با تغییر آن مقدار دوباره اجرا شود.
با useEffectEvent، هیچ مقداری که در رویداد استفاده شده، نیاز نیست در آرایه وابستگی useEffect قرار گیرد. همچنین یادداشت‌های انتشار نسخه تاکید می‌کند که نباید از افکت رویداد در آرایه وابستگی useEffect استفاده کرد. برای پشتیبانی از این تغییرات، نسخه جدید eslint-plugin-react-hooks نیز منتشر شده است.
بازخوردهای معرفی useEffectEvent
یکی از کاربران در X گفته که React در حال تلاش برای حل مشکلاتی است که خودش ایجاد کرده و کاربر دیگری گفته که تیم React یک هوک جدید ساخته فقط برای رفع یک قانون lint.
یکی از اعضای تیم اصلی React به این انتقادات پاسخ داده و توضیح داده که این مشکل صرفا مربوط به React نیست و همه مدل‌های واکنشی (Reactive) راه‌هایی برای غیرفعال کردن واکنش‌پذیری دارند و به نمونه‌های «untrack» در فریم‌ورک‌های دیگر اشاره کرده است.
یک توسعه‌دهنده در ردیت معتقد است که «این هوک از زمان معرفی هوک‌ها، به‌شدت مورد نیاز بوده است.»
قابلیت cacheSignal
نسخه 19.2 همچنین cacheSignal را معرفی می‌کند، که به توسعه‌دهندگان امکان می‌دهد بدانند چه زمانی طول عمر cache() در React Server Components به پایان می‌رسد. این هوک یک AbortSignal بازمی‌گرداند به محض اینکه cache() منقضی شود و کنترل پاک‌سازی عملیات جاری را در اختیار توسعه‌دهنده قرار می‌دهد.
قابلیت Partial Pre-Rendering
در بخش React DOM، قابلیت Partial Pre-Rendering اضافه شده است. بخش‌هایی از برنامه می‌توانند از قبل در سرور رندر شوند و سپس رندر دوباره ادامه پیدا کند تا محتوای داینامیک اضافه شود، که باعث بهبود واکنش‌پذیری بارگذاری اولیه می‌شود.
دیگر تغییرات
چند تغییر داخلی نیز در این نسخه اعمال شده است، از جمله رفع باگ Batching Suspense Boundaries برای SSR. حالا Suspense Boundaries هنگام رندر سمت سرور به‌صورت دسته‌ای (Batch) عمل می‌کنند، به‌طوری که محتوا همزمان نمایش داده می‌شود و دیگر به صورت پراکنده نیست.
پشتیبانی از Web Streams با توابع renderToReadableStream، prerender، resume و resumeAndPrerender اضافه شده است.
➕ در مستندات توصیه شده که Node Streams به جای Web Streams استفاده شود؛ زیرا Node Streams بسیار سریع‌تر هستند و Web Streams به‌صورت پیش‌فرض فشرده‌سازی را پشتیبانی نمی‌کنند.
جمع‌بندی
نسخه 19.2 سومین انتشار پس از نسخه 19.0 است و پس از 19.1 در اوایل سال جاری منتشر شده و روند پیوسته بهبودهای تدریجی را ادامه می‌دهد. توسعه‌دهندگان می‌توانند فهرست کامل تغییرات را در وبلاگ React مشاهده کنند.
React یک کتابخانه متن‌باز جاوااسکریپت برای ساخت رابط کاربری به‌صورت بیانی و کارآمد است. این کتابخانه در وب و محیط‌های بومی کاربرد دارد. همچنین قابلیت‌هایی مانند هوک‌ها، رندر همزمان (Concurrent Rendering)، کامپوننت‌های سرور و کامپایلری در حال توسعه ارائه می‌کند.
منبع: infoq.com
دیدگاهتان را بنویسید