🎿 👨‍💻 🛃 Flutter में एप्लिकेशन स्थिति प्रबंधित करें 🐎 🐱 👩🏾‍🏭

नमस्कार, हेब्र! लेख का अनुवाद प्रस्तुत करते हुए, मैं आपको अपने ऐप के लिए एक राज्य प्रबंधन समाधान को समझने और चुनने में मदद करता हूं , जिसने मेरी नज़र को पकड़ा और फ़्लटर में राज्य प्रबंधन की मूल बातें सीखने की प्रक्रिया में रुचि हो गई। इस अनुवाद के संबंध में किसी भी आलोचना को सुनकर मुझे खुशी होगी। Backquotes (``) में मेरे व्यक्तिगत विचार और स्पष्टीकरण लिखे जाएंगे।

स्पंदन राज्य प्रबंधन एक गर्म विषय है। समस्या के कई संभावित समाधान हैं, और उनमें भ्रमित होना, अपनी आवश्यकताओं के लिए सबसे उपयुक्त चुनना बेहद सरल है। मैं खुद भ्रमित था, लेकिन एक उपयुक्त समाधान मिला। मैं इसे आपके साथ साझा करता हूं।

एक समाधान खोजने के लिए जो आपकी आवश्यकताओं के अनुरूप है, आपको खुद को आवश्यकताओं को निर्धारित करने की आवश्यकता है। मेरे मामले में, यह है:

कोड की गुणवत्ता से समझौता किए बिना परियोजना को विकसित करने का अवसर है
व्यापार तर्क से अलग प्रदर्शन तर्क
स्पष्ट कोड है जिसे तोड़ना मुश्किल है
कोड की भविष्यवाणी और समझदारी

इन आवश्यकताओं को देखते हुए, उपयुक्त विकल्प बने हुए हैं:

setState() विधि और स्टेटफुल विजेट का उपयोग करना
`लाइब्रेरी` स्कॉप्डमॉडल
BLoC पैटर्न (व्यावसायिक तर्क घटक) का उपयोग करना
Redux

स्थानीय और वैश्विक स्थिति के बीच का अंतर

चयनित समाधानों के विश्लेषण में गोता लगाने से पहले, आपको स्थानीय और वैश्विक स्थिति के बीच अंतर को समझने की आवश्यकता है। इसके लिए एक व्यावहारिक उदाहरण उपयुक्त है:
एक प्राधिकरण फ़ॉर्म की कल्पना करें, जहां उपयोगकर्ता को उपयोगकर्ता नाम और पासवर्ड दर्ज करने के लिए कहा जाता है और फॉर्म भेजने के बाद ऑब्जेक्ट "उपयोगकर्ता पहचान" प्राप्त करता है। इस उदाहरण में, प्रपत्र फ़ील्ड में दर्ज किए गए डेटा का कोई भी सत्यापन `प्राधिकरण फ़ॉर्म विजेट` के स्थानीय स्थिति का हिस्सा होगा, और शेष एप्लिकेशन को इसके बारे में पता नहीं होना चाहिए। और "प्राधिकरण सर्वर" द्वारा लौटाया गया "पहचान" ऑब्जेक्ट वैश्विक स्थिति का हिस्सा है। इसलिए, अन्य घटक इस ऑब्जेक्ट पर निर्भर करते हैं कि उपयोगकर्ता अधिकृत है या नहीं, इस पर निर्भर करते हुए व्यवहार बदलते हैं।

उन लोगों के लिए संक्षिप्त निष्कर्ष जो इंतजार कर के थक गए हैं

यदि आप प्रतीक्षा नहीं करना चाहते हैं, या मेरे शोध में रुचि नहीं रखते हैं, तो यहां परिणामों का संक्षिप्त विवरण दिया गया है:

मेरी अनुशंसा स्थानीय राज्य प्रबंधन और वैश्विक राज्य के लिए Redux के लिए BLoC का उपयोग करना है, खासकर यदि आप एक जटिल अनुप्रयोग बना रहे हैं जो समय के साथ बढ़ेगा।

आपको सेटस्टेट () का उपयोग क्यों नहीं करना चाहिए

अपने विजेट्स के अंदर setState() का उपयोग करना setState() से प्रोटोटाइप बनाने और इन परिवर्तनों पर प्रतिक्रिया प्राप्त करने के लिए बहुत अच्छा है, लेकिन इस तरह से हमें अपने लक्ष्यों को प्राप्त करने में मदद नहीं मिलती है, क्योंकि डिस्प्ले लॉजिक व्यावसायिक तर्क के साथ मिलाया जाता है, जो स्वच्छता और कोड की गुणवत्ता के सिद्धांत का उल्लंघन करता है। भविष्य में ऐसे कोड का रखरखाव मुश्किल होगा, इसलिए, प्रोटोटाइप बनाने के अलावा, इस दृष्टिकोण की सिफारिश नहीं की जाती है।

ScopedModel - सही दिशा में एक कदम

ScopedModel ब्रायन एगन की एक तृतीय-पक्ष लाइब्रेरी है। यह विशेष Models ऑब्जेक्ट बनाने के लिए संभव बनाता है, साथ ही आवश्यक होने पर notifyListeners() विधि का उपयोग करता है। उदाहरण के लिए, किसी मॉडल ऑब्जेक्ट के गुणों में किसी भी परिवर्तन पर नज़र रखने के लिए:

 class CounterModel extends Model { int _counter = 0; int get counter = _counter; void increment() { _counter++; notifyListeners(); } }

हमारे विजेट्स में, हम ScopedModelDescendant लाइब्रेरी ScopedModelDescendant द्वारा प्रदान किए गए ScopedModelDescendant विजेट 'का उपयोग करके मॉडल में बदलावों का जवाब देने में सक्षम होंगे:

 class CounterApp extends StatelessWidget { @override Widget build(BuildContext context) { return new ScopedModel<CounterModel>( model: new CounterModel(), child: new Column(children: [ new ScopedModelDescendant<CounterModel>( builder: (context, child, model) => new Text('${model.counter}'), ), new Text(" ,     CounterModel") ]) ); } }

setState() दृष्टिकोण का उपयोग करने के विपरीत, यह समाधान आपको व्यापार तर्क से प्रदर्शन तर्क को अलग करने की अनुमति देता है। हालाँकि, यह कुछ प्रतिबंध लगाता है:

यदि Model जटिल हो जाता है, तो यह निर्धारित करना मुश्किल हो जाता है कि इंटरफ़ेस के अनावश्यक अद्यतन से बचने के लिए, notifyListeners() विधि का उपयोग कब करना है और कब नहीं।
Model द्वारा प्रदान किया गया एपीआई, सामान्य रूप से, एप्लिकेशन इंटरफ़ेस की अतुल्यकालिक प्रकृति का सटीक वर्णन नहीं करता है

यह सब देखते हुए, यदि आपके एप्लिकेशन की स्थिति को प्रबंधित करना आसान नहीं है, तो मैं इस डेटा दृष्टिकोण का उपयोग करने की अनुशंसा नहीं करता हूं। मैं सिर्फ यह नहीं मानता कि वह अनुप्रयोगों की वृद्धि और जटिलता को उत्पादक रूप से प्रदान करने में सक्षम है।

शक्तिशाली समाधान - बीएलओसी

इस पैटर्न का आविष्कार Google द्वारा किया गया था और इसका उपयोग वहां भी किया जाता है। वह हमें निम्नलिखित लक्ष्य हासिल करने में मदद करेगा:

व्यावसायिक तर्क से प्रदर्शन तर्क को अलग करना
इंटरफ़ेस प्रदर्शित करने के लिए अतुल्यकालिक प्रकृति का उपयोग करना
फ़्लटर या एंगुलरडार्ट जैसे विभिन्न डार्ट अनुप्रयोगों में पुन: उपयोग करने की क्षमता

इस दृष्टिकोण के पीछे का विचार बहुत सरल है:

बीएलओसी का उपयोग करता है
```
 Sink<T> 
```
अपने डेटा घटकों में अतुल्यकालिक रूप से प्रवेश करने के लिए आपी का वर्णन
बीएलओसी का उपयोग करता है
```
 Stream<T> 
```
Api हमारे घटकों द्वारा अतुल्यकालिक रूप से डेटा का वर्णन करने के लिए
अंत में, हम डेटा अपडेट्स और रीडायरेक्ट विजेट्स की सदस्यता के लिए हमारी ओर से कोई प्रयास किए बिना, डेटा प्रवाह को नियंत्रित करने के लिए StreamBuilder विजेट का उपयोग कर सकते हैं।

Google के पास इस राज्य प्रबंधन पैटर्न का उपयोग करने के अच्छे उदाहरण हैं क्योंकि यह कंपनी द्वारा व्यापक रूप से उपयोग और अनुशंसित है।

मैं स्वयं स्थानीय राज्य के प्रबंधन के लिए इस दृष्टिकोण का उपयोग करने की अत्यधिक अनुशंसा करता हूं, लेकिन यह वैश्विक राज्य के प्रबंधन के लिए भी उपयुक्त है। हालांकि, बाद के मामले में, आप एक समस्या का सामना करेंगे - जहां और कैसे बीएलओसी को सही ढंग से लागू करना है ताकि विभिन्न घटकों तक इसकी पहुंच हो, और फिर रेडक्स दृश्य में प्रवेश करता है।

Redux और BLoC - मेरे लिए सही मिश्रण है

लेख की शुरुआत में मैंने जिन लक्ष्यों का वर्णन किया था, उनमें से एक ऐसा था जिसे व्यापक रूप से उपयोग किया जाने वाला और अनुमान लगाने योग्य था, और यह Redux है - एक पैटर्न और औजारों का एक सेट जो हमें वैश्विक स्थिति का प्रबंधन करने में मदद करते हैं। इसके मूल में तीन मूल सिद्धांत हैं:

सत्य का एकमात्र स्रोत यह है कि आपके आवेदन की state पूरे राज्य को एक एकल store में एक ट्री ऑब्जेक्ट में संग्रहीत किया जाता है

राज्य केवल पढ़ने के लिए है - राज्य को बदलने का एकमात्र तरीका एक विशेष एक्शन ऑब्जेक्ट को कॉल करना है जो बताता है कि राज्य का क्या होना चाहिए
परिवर्तन शुद्ध कार्यों का उपयोग करके किए जाते हैं - यह निर्धारित करने के लिए कि राज्य में क्या परिवर्तन होते हैं, आप शुद्ध ` reducer फ़ंक्शन reducer हैं, जो किसी भी दुष्प्रभाव का कारण नहीं होना चाहिए` नमूना कोड के लिए लिंक`

मूल पोस्ट से लिंक करें, जहां से छवि आती है

प्रबंध राज्य के इस दृष्टिकोण को वेब डेवलपर्स द्वारा व्यापक रूप से स्वीकार किया जाता है, और मोबाइल उपकरणों पर इसकी उपस्थिति वेब और मोबाइल-एप्लिकेशन डेवलपर्स के लाभ प्राप्त करने में मदद करेगी।

ब्रायन एगन मूल Redux और flutter_redux दोनों को विकसित कर रहा है, और उन्होंने एक भयानक टोडो एप्लिकेशन भी बनाया जिसमें उन्होंने Redux सहित कई वास्तुशिल्प पैटर्न लागू किए।
Redux के सभी गुणों को देखते हुए, मैं दृढ़ता से इसे वैश्विक स्थिति का प्रबंधन करने के लिए उपयोग करने की सलाह देता हूं, लेकिन आपको यह सुनिश्चित करना चाहिए कि आप इसका उपयोग स्थानीय राज्य के प्रबंधन के लिए नहीं करते हैं यदि आप अपने आवेदन को स्केल करना चाहते हैं।

अंतिम शब्द

इस लेख में पूरी तरह से सही या गलत समाधान नहीं है। यह तय करने के लिए कि आपकी परियोजना में किस दृष्टिकोण से आवेदन करना है, आपको अपनी आवश्यकताओं पर निर्णय लेने की आवश्यकता है। मेरे और मेरे लक्ष्यों के लिए, Redux और BLoC का संयोजन मेरी परियोजनाओं को जल्दी और सुरक्षित रूप से विकसित करने की अनुमति देता है, और तीसरे पक्ष के डेवलपर्स के लिए इन परियोजनाओं में प्रवेश करना आसान भी बनाता है, जो सुलभ और स्पष्ट उपकरणों के लिए धन्यवाद। हालाँकि, सभी की ज़रूरतें एक जैसी नहीं होती हैं और समय के साथ आप दोनों समस्याओं को 'मौजूदा उपकरणों में' और बेहतर समाधान भी पा सकते हैं। हमेशा जिज्ञासु बने रहना, सीखना और सोचना बहुत महत्वपूर्ण है कि क्या यह या वह उपकरण आपके लिए सही है।