مدیریت وضعیت در React: چه زمانی از چه چیزی استفاده کنیم

یک پروژه React جدید را شروع می‌کنید. همه چیز تمیز و مرتب به نظر می‌رسد. سپس داده‌ها را از میان پنج لایه عبور می‌دهید. این همان prop-drilling است. احساس می‌کنید درجا می‌زنید.

ابزار مناسب را انتخاب کنید.

useState: جیب شما از این برای داده‌های محلی استفاده کنید. موارد کوچک را اینجا قرار دهید.

  • وضعیت دراپ‌دان (Dropdown)
  • فیلدهای ورودی (Input fields) آن را محلی نگه دارید.

Context API: یخچال خانوادگی همه بدون اجازه داده‌ها را برمی‌دارند. از این برای داده‌های سراسری (global) استفاده کنید.

  • وضعیت ورود کاربر
  • تنظیمات تم (Theme)
  • تنظیمات زبان از این برای داده‌هایی استفاده کنید که به ندرت تغییر می‌کنند.

Zustand: انباری این ابزار سازمان‌یافته است. از آن برای داده‌های سنگین استفاده کنید.

  • سبد خرید
  • داشبوردهای پیچیده زمانی از این استفاده کنید که اپلیکیشن شما شلوغ و نامنظم به نظر می‌رسد.

برنامه:

  • با useState شروع کنید.
  • وقتی prop-drilling دردسرساز شد، به سراغ Context بروید.
  • وقتی عملکرد (performance) کاهش یافت، به Zustand مهاجرت کنید.

ساده نگهش دارید. کدنویسی خوش بگذرد.

منبع: https://dev.to/zeeshan_farooq_4ead3782d8/react-state-management-when-to-use-what-a-simple-guide-1cf1