Table of Contents
مقدمه: چرا مدیریت دولتی در React Native اهمیت دارد
مدیریت دولتی ستون فقرات هر برنامه React Native تعاملی است.چگونه ذخیره، به روز رسانی و به اشتراک گذاری داده ها به طور مستقیم بر پاسخگویی برنامه شما، اشکال زدایی و حفظ قابلیت ها، منجر به UI ثابت، اشکالات غیر قابل پیش بینی و یک چرخه توسعه ضعیف است، زیرا برنامه شما از چند صفحه نمایش به یک سیستم پیچیده با داده های آفلاین، و قابلیت های متعدد کاربر، به عنوان یک روش های ساده پردازش می شود.
درک کشور در React Native
دولت در React Native اشاره به هر گونه داده ای دارد که می تواند در طول زمان تغییر کند و بر آنچه کاربر می بیند تأثیر بگذارد.این از یک دکمه در / حالت در نمایه کاربر معتبر یا لیستی از محصولات استخراج شده است.
- [قطعات] (مشرکان) حالت [FLT 1] - داده هایی که تنها یک جزء یا یک خوشه کوچک از اجزای خواهر و برادر نیاز دارند.
- [shared] حالت - داده هایی که بسیاری از اجزای غیر مرتبط در سراسر برنامه نیاز به دسترسی به نمونه: کاربر فعلی، خرید سبد خرید، اولویت تم، شماره اطلاع رسانی.
انتخاب جایی و چگونگی ذخیره هر بخش از دولت، ماهیت مدیریت دولتی است.هدف این است که جریان داده ها را پیش بینی کنیم، از تغییرات غیر ضروری اجتناب کنیم و تغییرات دولتی را آسان تر برای ردیابی ایجاد کنیم.
بهترین روش ها برای مدیریت دولتی
۱- با کشور محلی شروع کنید: (FLT:0) و [FLT 1 ]
قلاب های داخلی React اولین و اغلب بهترین ابزار شما هستند. برای قطعات ساده و مستقل دولتی ایده آل است - به عنوان مثال، چک باکس یا ورودی متن قابل استفاده خود را نگه می دارد، هنگامی که منطق دولت پیچیده تر می شود (چندین مقدار وابسته، به روز رسانی های متقابل)، سوئیچ به [F:2user] قرمز [F].
۲- بلند کردن دولت تنها در صورت لزوم
هنگامی که دو یا چند جزء خواهر و برادر نیاز به به اشتراک گذاری همان قطعه از داده ها، رویکرد ضداتیک React به "lift" است که به نزدیک ترین اجداد مشترک خود اشاره می کند، داده ها و به روز رسانی به عنوان پروپان عمل می کند، این اجتناب از تکثیر حالت و نگه داشتن جریان منحصر به فرد است، با این حال، جلوگیری از بلند کردن بیش از حد بالا.
۳- استفاده از API (با استفاده از برای اشتراک گذاری متوسط
هنگامی که حفاری اجباری دردناک می شود - عبور از تبلیغات از طریق پنج یا چند لایه - [یادداشت API] دستور می دهد یک فرار پاک تر ایجاد کنید که دارای شی حالت حالت و یک تابع ارسال است. ترکیب آن با use Reducer در داخل ارائه دهنده برای متمرکز کردن منطق به روز رسانی.این الگوی عالی برای برنامه های خوراک متوسط کار می کند، (به طور منطقی به یک ویژگی جداگانه نیاز دارید:
۴- اتخاذ یک کتابخانه مدیریت دولتی برای برنامه های بزرگ-Scale
هنگامی که برنامه شما به ده ها صفحه نمایش می رسد، بسیاری از جریان داده های ناهمزمان و قوانین پیچیده کسب و کار، یک کتابخانه قوی ضروری می شود.
- Redux Toolkit (RTK) [FLT] [FLT]؛ نسخه رسمی، نظر سنجی شده از Redux. RTK، قاب دیگ بخار را به طور قابل توجهی با و پشتیبانی داخلی از یک چراغ های نرم افزاری کامپوزیتی، پیکربندی فروشگاه را ساده می کند و با ReduxTools پیشرفته برای پیش بینی دقیق داده های قابل پیش بینی و قابل پیش بینی ترکیب می شود.
- Zustand : یک سبک، قلاب اول مدیر دولتی با حداقل API، شما یک فروشگاه کوچک با استفاده از [FLT-7] ایجاد و دسترسی به حالت به طور مستقیم از قلاب ها.Zstand اجتناب بسیاری از دیگ قرمز است در حالی که هنوز ارائه می دهد واسطه (مست، devtools) و عملکرد ایده آل عالی برای تیم های ساده است که بدون قربانی سادگی.
- MobX-State-Tree [MST] : استفاده از حالت قابل مشاهده و واکنش ضمنی. مدل های تعریف با انواع، اقدامات و خواص محاسبه شده به طور خودکار وابستگی ها را ردیابی می کند و فقط اجزایی که مقادیر را تغییر می دهند، بزرگ برای توسعه دهندگان که ترجیح می دهند یک رویکرد مبتنی بر شی گرا، مدل سازی و بهینه سازی خودکار.
بر اساس آشنایی تیم خود و نیازهای خاص برنامه انتخاب کنید. Redux Toolkit یا Zustand نقطه شروع عالی هستند.
مدیریت کشور Asynchronous با ابزارهای اختصاصی
اطلاعات سرور (API تماس، GraphQL، Firebase) سزاوار درمان خود است، دولت سرور را با حالت UI در همان فروشگاه جهانی مخلوط نکنید. کتابخانه های اختصاصی مانند PFLT:0TanStack Query (React Query) [FLT 1] و SWR مدیریت پس زمینه ای را که آنها را به طور چشمگیری از آن جدا می کند، کاهش می دهد.
۶- کشور پرکار که در آن جا مناسب است
بسیاری از برنامه های React Native نیاز به بقا مجدد برنامه دارند: ترجیحات کاربر، توکن های تأییدیه، داده ها را پیش نویس می کنند، برش های حیاتی پروستات به ذخیره سازی محلی استفاده می کنند. AsyncStorage برای ذخیره سازی ساده کلید = 6، اما همگام سازی (FLT:2react-nact-native-nactative-n-n-inter [F] [3] برای عملکرد بالا (FATCH)
بهینه سازی عملکرد: خاطرات و انتخاب کنندگان
بیش از حد تکرارها علت اصلی مسائل عملکردی در React Native هستند:
- استفاده از ، React.memo[[FLT] برای اجزایی که به طور مکرر همان وسایل را دریافت می کنند.
- استفاده از |و برای تثبیت و تثبیت ارجاعات و عملکرد به عنوان آگهی.
- هنگام استفاده از کتابخانه های قرمز یا مشابه، همیشه برش های داده های حداقل را با انتخاب کنندگان یادداشت شده انتخاب کنید (به عنوان مثال، از Reselect) این مانع از تقسیم مجدد قطعات غیر مرتبط با تغییر فروشگاه می شود.
- برای تنظیمات زمینه-heavy، ارائه دهندگان تقسیم به طوری که تنها زیردرخت مربوطه در به روز رسانی دوباره باز می شود.
برنامه خود را با React DevTools و مانیتور عملکرد مترو برای شناسایی نقاط عطف، اغلب یک از دست رفته [FLT 11] بر روی یک مقدار زمینه می تواند سرعت یک صفحه نمایش کامل را کاهش دهد.
۸- منطق کشور خود را آزمایش کنید
منطق مدیریت دولتی باید در انزوا آزمایش شود، بدون اینکه کل درخت جزء را نصب کند. [۳] برای Redux، تست واحد برای کاهش دهنده ها و سازندگان عمل با استفاده از Jest برای زوکن، فروشگاه را به طور مستقیم با تماس گیرنده ها و تنظیم کنندگان آن تست کنید.
نکات اضافی
- حداقل حالت را نگه دارید: ارزش های مشتق از حالت موجود در هر زمان که ممکن است (به عنوان مثال، محاسبه یک قیمت کلی از یک آرایه اقلام به جای ذخیره آن به طور جداگانه).
- قابلیت استفاده کلید است: همیشه اشیاء / پرتوهای جدید را هنگام به روز رسانی حالت استفاده از اپراتورهای گسترش (FLT:12 / [ [FLT 13 ]، یا کتابخانه هایی مانند Immer برای جلوگیری از اشکالات جهشی باز کنید.
- [[۱] [۱۰] [۱] [۱۰] [۱] [۱۰] [۱]] [۳] [۳] [۳] [۳] [۳] [۱]] برای ردو، استفاده از [FLT ۱۴] یا ردوگان / تیشوک [برای زوور]، ساده در داخل قسمت سمت راست، به طور تمیز عمل می آید.
- Cache به طور انتخابی : از React Query یا SWR برای ذخیره سازی حالت سرور استفاده کنید.اطلاعات سرور را در فروشگاه محلی تکرار نکنید مگر اینکه مجبور شوید آن را به صورت آفلاین و همگام سازی کنید.
- به طور منظم regularly refactor : به عنوان برنامه شما تکامل می یابد، معماری ایالتی خود را بازبینی کنید. حالت محلی را به زمینه یا کتابخانه هنگامی که حفاری اجباری آشفته می شود.
نتیجه گیری
مدیریت دولتی موثر در React Native در مورد پیروی از یک معماری تجویز شده نیست – در مورد انتخاب ابزار مناسب برای هر نوع دولت و نگه داشتن جریان داده های شما قابل پیش بینی است. شروع ساده با و مقیاس به اشتراک گذاری متوسط، و اتخاذ کتابخانه هایی مانند Redux Toolkit یا زوور زمانی که پیچیدگی برنامه شما نیاز به یک سرور متمرکز، همیشه فراموش کردن و استفاده از ابزار عملکرد دولتی است: و هرگز عاقلانه.
با استفاده از بهترین شیوه ها در جریان کار توسعه خود، می توانید برنامه های React Native را بسازید که پاسخگو، قابل نگهداری و لذت بخش برای کار کردن هستند – حتی زمانی که به ده ها هزار خط کد تبدیل می شوند، کلید این است که دولت را به عنوان یک شهروند درجه اول، نه یک پس از تفکر، درمان کنید.