Redux چیست و چرا در توسعه وب اهمیت دارد؟

اگر بخواهیم به این سوال پاسخ دهیم که Redux چیست، طبق تعریف اینطور باید بگوییم که یک کانتینر قابل پیش‌بینی state برای برنامه‌های جاوااسکریپت است. برای این که معنای آن را دقیق‌تر درک کنیم ابتدا باید با تعدادی از تعاریف آشنا شویم. در این مقاله قصد داریم تا این مفاهیم را باهم بررسی کنیم.

نگاهی عمیق‌تر به stateها

این مثال را در نظر بگیرید: شما از اپلیکیشن X در گوشی خود استفاده می‌کنید، برخی کارها را با آن برنامه انجام می‌دهید و سپس به برنامه Y می‌روید و کارهای مختلفی را در آن انجام می‌دهید. در همین حین متوجه می‌شوید که کاری را در برنامه X فراموش کرده‌اید، بنابراین به اولین برنامه برمی‌گردید. وقتی آن برنامه اصلی را دوباره باز می‌کنید در همان stateای که آخرین بار آن را ترک کردید در همان حالت قرار دارد.

سه اصل مهم برای state وجود دارد:

  • state یک برنامه، همیشه در یک آبجکت جاوااسکریپت ذخیره می‌شود.
  • اگرچه state فقط خواندنی است، اما می‌توان با توصیف تغییرات و با استفاده از یک action جاوااسکریپتی آن را تغییر داد.
  • تغییرات یک state توسط یک تابع کاهنده انجام می‌شود که state فعلی را می‌پذیرد و از طریق یک action در صورت تغییر، state جدید و در صورت عدم تغییر، state اولیه را برمی‌گرداند.

مواردی که تاکنون بررسی کردیم مفاهیم اساسی هستند اما کاری که Redux انجام می‌دهد بسیار بیشتر از این‌ها است.

Redux چیست؟

اگر بخواهیم خلاصه بگوییم که Redux چیست، راهی برای مدیریت state است یا می‌توان گفت یک حافظه پنهان یا ذخیره‌سازی است که می‌تواند توسط همه کامپوننت‌ها با روشی ساختاریافته قابل دسترسی باشد.

Redux زمانی شروع شد که فیس‌بوک با ساختار Model-View-Controller به مشکل برخورد. MVC یک الگوی طراحی نرم افزاری است که یک برنامه را به سه جزء تقسیم می‌کند: Model (منطق مربوط به داده‌ها)، View (منطق UI برای یک اپلیکیشن) و Controller (رابط بین Model و View). هنگامی که فیس‌بوک نیاز به مقیاس‌گذاری گسترده داشت، ساختار MVC شروع به شکست آن‌ها کرد.

در این مرحله، فیس‌بوک Flux را منتشر کرد، که روشی یک‌ طرفه برای به‌روزرسانی کامپوننت View و مدیریت اقدامات مبتنی بر کاربر است.

در ژوئن ۲۰۱۵، دن آبراموف Redux را ایجاد کرد که بر اساس Flux فیس‌بوک و زبان برنامه نویسی Elm است. تغییرات بزرگی که آبراموف در Redux ایجاد کرد این بود که او فقط از یک store استفاده کرد و dispatcher را حذف کرد. dispatcher یک برنامه مخصوصی است که با یک زمانبند ارتباط برقرار می‌کند و یک فرآیند را به state مورد نظر می‌رساند.

store راهی برای ذخیره و مدیریت مداوم مجموعه‌ای از داده‌ها است. Flux از چندین store استفاده کرد در حالی که Redux فقط یک store دارد. بنابراین اگر کامپوننت‌های متعددی در یک برنامه داریم، تنها یک store وجود دارد که state کامپوننت‌ها را مدیریت کند. آن store می‌تواند هر state داده شده را به هر کامپوننتی انتقال دهد، و آن را به یک مدل فوق‌العاده مؤثر و کارآمد تبدیل ‌کند.

آیا Redux یک فریم‌ورک است؟

به‌طور خلاصه خیر Redux فریم‌ورک نیست.

Redux به جای اینکه یک کتابخانه یا فریم‌ورک سنتی باشد، یک معماری جریان داده است. برای استفاده از Redux توصیه می‌شود که با Redux toolkit کار کنیم، اما بخش‌های اصلی آن عبارتند از:

  • Action
  • Reducers
  • Middleware
  • Store

یک فریم‌ورک نرم‌ افزاری پلتفرم توسعه است که ممکن است شامل کتابخانه‌های کد، کامپایلر و ابزارهای لازم برای ساخت برنامه‌های کامل باشد. از طرف دیگر، Redux به سادگی یک کتابخانه جاوااسکریپت با یک وظیفه واحد یعنی مدیریت stateها در برنامه‌های جاوااسکریپتی می‌باشد.

بنابراین به جای اینکه برنامه‌های خود را با Redux بسازیم، از آن استفاده می‌کنیم تا مطمئن شویم که stateهای برنامه جاوااسکریپتی ما قابل مدیریت هستند.

همچنین Redux معمولاً با کتابخانه‌هایی مانند React و Angular مورد استفاده قرار می‌گیرد. با ترکیب آن‌ها باهم می‌توانیم رابط‌های کاربری را توسعه دهیم که به stateهای دلخواه بستگی دارند.

کاربرد Redux چیست؟

از نظر برنامه نویسی، می‌توانیم از Redux برای برنامه‌هایی که داده‌ها بین کامپوننت‌ها به اشتراک گذاشته می‌شود استفاده کنیم. به عنوان مثال برنامه‌ای داریم که از یک کامپوننت login استفاده می‌کند. داده‌های کامپوننت login به سیستم با کامپوننت status به اشتراک گذاشته می‌شود. اکثر برنامه‌هایی که از Redux استفاده می‌کنند برنامه‌های تلفن همراه هستند (البته استثناء‌هایی نیز وجود دارد). چند نمونه از این موارد عبارتند از:

  • دیباگر Firefox
  • Franklin – یک ابزار تفسیر توالی DNA.
  • Portfolio CMS – CMS مبتنی بر Rails و ابزار وبلاگ نویسی.
  • GitHunt – Reddit برای GitHub
  • Datamaps – پلتفرمی برای تجسم نقشه‌ها.
  • Favesound – پخش‌کننده Soundcloud.
  • Podbaby – یک کلاینت پادکست وب.
  • Gitchecker – نمایش‌دهنده وضعیت پروژه‌های GitHub.

Redux مربوط به سمت فرانت‌اند است یا بک‌اند؟

قبل از اینکه به این سوال پاسخ دهیم، اجازه دهید فرانت‌اند و بک‌اند را به زبان ساده تعریف کنیم.

فرانت‌اند رابط کاربری یا نرم افزار کلاینت است و بک‌اند قسمت سرور می‌باشد.

اکنون سوالی که وجود دارد این است که آیا Redux در سمت فرانت‌اند مورد استفاده قرار می‌گیرد یا در سمت بک‌اند؟ پاسخ آسان است، در هر دو سمت. Redux می‌تواند برای هر برنامه‌ای که اولویت بالایی بر توانایی ذخیره‌سازی stateها به‌طور پیش‌بینی‌شده دارد، استفاده شود.

واضح است که Redux می‌تواند برای سمت کلاینت یعنی فرانت‌اند با رابط‌های کاربری استفاده شود. با این حال، از آنجایی که Redux فقط با زبان برنامه نویسی جاوااسکریپت است، می‌توان از آن در سمت سرور یعنی بک‌اند نیز مورد استفاده قرار داد.

یکی از مثال‌های خوب استفاده از Redux در بک‌اند، بازی‌های چندنفره است که در یک مرورگر اجرا می‌شوند و باید state خود را روی سرور ذخیره کنند تا اطمینان حاصل شود که همه بازیکنان دید یکسانی از بازی دارند. در این مثال، سرور state را نگه می‌دارد و به عنوان «منبع واحد حقیقت» دیده می‌شود.

آیا Redux همچنان از محبوبیت خوبی برخوردار است؟

پست‌ها و نظرات زیادی وجود دارد که نشان می‌دهد که Redux کنار گذاشته شده و یا ابزار دیگری جایگزین آن شده است. اما اینطور نیست و Redux هنوز هم بسیار محبوب است و با بسته رسمی Redux Toolkit، که هسته Redux را دربرمی‌گیرد و ابزارهایی برای ساده‌سازی تعدادی از موارد استفاده رایج آن را ارائه می‌دهد استفاده از این کتابخانه جاوااسکریپتی آسان‌تر از همیشه گشته است.

دیدگاه‌ها:

ziba

مهر 25, 1402  در  3:06 ب.ظ

افزودن دیدگاه جدید