रेडक्स और आरएक्सजेएस, कोई समानताएं?

Question

मुझे पता है कि रेडक्स फ्लक्स का बेहतर "कार्यान्वयन" है, या बेहतर कह रहा है कि यह चीजों को सरल बनाने के लिए एक नया स्वरूप है (एप्लिकेशन स्टेट मैनेजमेंट)।

मैंने प्रतिक्रियाशील प्रोग्रामिंग (आरएक्सजेएस) के बारे में बहुत कुछ सुना है, लेकिन मैंने इसे अभी तक सीखने के लिए नहीं डाला है।

तो मेरा सवाल है: क्या इन दो प्रौद्योगिकियों के बीच कोई अंतरंग (कुछ भी सामान्य है) या वे पूरक हैं? ... या पूरी तरह से अलग?

Answer 1

संक्षेप में, वे बहुत अलग उद्देश्यों के लिए बहुत अलग पुस्तकालयों रहे हैं, लेकिन हाँ वहाँ कुछ अस्पष्ट समानताएं हैं।

रेडक्स पूरे एप्लिकेशन में राज्य के प्रबंधन के लिए एक उपकरण है। यह आमतौर पर यूआई के लिए एक वास्तुकला के रूप में प्रयोग किया जाता है। इसे कोणीय (आधा) के विकल्प के रूप में सोचें।

आरएक्सजेएस एक प्रतिक्रियाशील प्रोग्रामिंग लाइब्रेरी है। यह आमतौर पर जावास्क्रिप्ट में एसिंक्रोनस कार्यों को पूरा करने के लिए एक उपकरण के रूप में प्रयोग किया जाता है। वादा के विकल्प के रूप में इसके बारे में सोचें।

---

रिएक्टिव प्रोग्रामिंग एक प्रतिमान (काम करने और सोच के रास्ते) जहां डाटा परिवर्तन एक दूरी से मनाया जाता है है। डेटा से दूरी से बदला नहीं गया है।

// In the controller.js file 
model.set('name', 'George'); 

मॉडल नियंत्रक से बदल गई है:

यहाँ का एक उदाहरण एक दूरी से बदल रहा है।

यहाँ का एक उदाहरण एक दूरी से मनाया है:

// logger.js 
store.subscribe(function (data) { 
    console.log(data); 
}); 

लॉगर में, हम डेटा परिवर्तन है कि (एक दूरी से) स्टोर में होने का निरीक्षण, और कंसोल लिखें।

---

रेडक्स प्रतिक्रियाशील प्रतिमान का उपयोग थोड़ा सा करता है: स्टोर प्रतिक्रियाशील है। आप अपनी सामग्री को दूरी से सेट नहीं करते हैं। यही कारण है कि Redux में store.set() नहीं है। स्टोर दूरी से कार्यों को देखता है, और खुद को बदलता है। और स्टोर दूसरों को दूरी से अपना डेटा देखने की अनुमति देता है।

आरएक्सजेएस भी प्रतिक्रियाशील प्रतिमान का उपयोग करता है, लेकिन एक आर्किटेक्चर होने की बजाय, यह आपको "दूरी से देखकर" पैटर्न को पूरा करने के लिए बुनियादी बिल्डिंग ब्लॉक, पर्यवेक्षण देता है।

निष्कर्ष निकालने के लिए, विभिन्न उद्देश्यों के लिए बहुत अलग चीज़ें, लेकिन कुछ विचार साझा करें।

Answer 2

वे बहुत अलग चीजें हैं।

आरएक्सजेएस का उपयोग प्रतिक्रियाशील प्रोग्रामिंग करने के लिए किया जा सकता है और 250+ ऑपरेटरों के साथ एक बहुत अच्छी लाइब्रेरी है।

और रेडक्स जैसा कि जिथब रेपो पर वर्णित है "रेडक्स जावास्क्रिप्ट ऐप्स के लिए अनुमानित राज्य कंटेनर है"।

रेडक्स केवल ऐप्स में राज्य को संभालने का एक टूल है। लेकिन तुलना में आप केवल आरएक्सजेएस में एक पूर्ण ऐप बना सकते हैं।

आशा इस मदद करता है :)

Answer 3

मैं केवल कुछ व्यावहारिक अंतर जोड़ना चाहता था जब मैंने रेडक्स-प्रेरित आरएक्सजेएस-कोड किया था।

मैंने प्रत्येक क्रिया प्रकार को विषय उदाहरण में मैप किया। प्रत्येक राज्य के घटक में एक विषय होगा जिसे फिर एक reducer फ़ंक्शन में मैप किया जाता है। सभी reducer धाराओं को merge के साथ संयुक्त किया जाता है और फिर scan राज्य को आउटपुट करता है। डिफ़ॉल्ट मान के साथ scan से ठीक पहले सेट किया गया है। मैंने राज्यों के लिए publishReplay(1) का उपयोग किया, लेकिन बाद में इसे हटा सकता है।

प्रतिक्रिया शुद्ध रेंडर फ़ंक्शन केवल उस स्थान पर होगा जहां आप सभी उत्पादकों/विषयों में ईवेंट डेटा भेजते हैं।

यदि आपके बच्चे के घटक हैं, तो आपको यह वर्णन करने की आवश्यकता है कि उन राज्यों को आपके साथ कैसे जोड़ा जाता है। combineLatest इसके लिए एक अच्छा प्रारंभिक बिंदु हो सकता है। कार्यान्वयन में

उल्लेखनीय मतभेद:

• नहीं मिडलवेयर, बस ऑपरेटरों rxjs। मुझे लगता है कि यह सबसे बड़ी शक्ति और कमजोरी है। आप अभी भी अवधारणाओं को उधार ले सकते हैं, लेकिन मुझे बहन समुदायों जैसे रेडक्स और cycle.js से सहायता प्राप्त करना मुश्किल लगता है क्योंकि यह अभी तक एक और कस्टम समाधान है। यही कारण है कि मुझे इस पाठ में "हम" के बजाय "मैं" लिखने की आवश्यकता है।

• कोई स्विच/केस या कार्रवाई प्रकारों के लिए तार नहीं। आपके पास कार्यों को अलग करने का एक अधिक गतिशील तरीका है।

• rxjs को कहीं और उपकरण के रूप में उपयोग किया जा सकता है, और यह राज्य प्रबंधन में निहित नहीं है।

• कार्रवाई प्रकारों (?) से उत्पादकों की कम संख्या। मुझे इसके बारे में निश्चित नहीं है, लेकिन आप मूल घटकों में कई प्रतिक्रियाएं कर सकते हैं जो बाल घटकों को सुनते हैं। इसका मतलब है कम आवश्यक कोड, और कम जटिलता।

• आपके पास समाधान है। कोई ढांचा आवश्यक नहीं है। अच्छा और बुरा। आप किसी भी तरह अपना खुद का ढांचा लिखना समाप्त कर देंगे।

• यह बहुत अधिक फ्रैक्टल है, और आप आसानी से उप-पेड़, या ऐप राज्य पेड़ के कई हिस्सों में परिवर्तनों की सदस्यता ले सकते हैं।

  • अनुमान लगाएं कि महाकाव्य को रेडक्स-पर्यवेक्षक के रूप में करना कितना आसान है? वास्तव में आसान।

मैं भी बहुत बड़ा लाभ जहां बच्चे घटकों धाराओं के रूप में वर्णित किया गया है पर काम कर रहा हूँ। इसका मतलब है कि हमें reducers में माता-पिता और बच्चे की स्थिति का चयन करने की आवश्यकता नहीं है, क्योंकि हम घटक संरचना के आधार पर राज्यों को दोबारा जोड़ सकते हैं ("बस")।

मैं प्रतिक्रिया छोड़ने और स्नैबडम या कुछ और के साथ जाने के बारे में भी सोचता हूं जब तक प्रतिक्रिया प्रतिक्रियाशील राज्यों को बेहतर तरीके से संभालती है। प्रोप के माध्यम से इसे तोड़ने के लिए हमें अपने राज्य को ऊपर क्यों बनाना चाहिए? तो मैं Snabbdom के साथ इस पैटर्न का संस्करण 2 बनाने की कोशिश करूंगा।

यहां एक और अधिक उन्नत लेकिन छोटा स्निपेट है जहां state.ts फ़ाइल राज्य स्ट्रीम बनाता है।यह अजाक्स-फॉर्म घटक का राज्य है जो सत्यापन नियमों और सीएसएस शैलियों के साथ फ़ील्ड (इनपुट) का एक वस्तु प्राप्त करता है। इस फ़ाइल में हम सभी बच्चों के राज्यों को फॉर्म स्थिति में गठबंधन करने के लिए केवल फ़ील्ड नाम (ऑब्जेक्ट कुंजियों) का उपयोग करते हैं।

export default function create({ 
    Observable, 
    ajaxInputs 
}) { 
    const fieldStreams = Object.keys(ajaxInputs) 
    .map(function onMap(fieldName) { 
    return ajaxInputs[fieldName].state.stream 
    .map(function onMap(stateData) { 
     return {stateData, fieldName} 
    }) 
    }) 

    const stateStream = Observable.combineLatest(...fieldStreams) 
    .map(function onMap(fieldStreamDataArray) { 
    return fieldStreamDataArray.reduce(function onReduce(acc, fieldStreamData) { 
    acc[fieldStreamData.fieldName] = fieldStreamData.stateData 
    return acc 
    }, {}) 
    }) 

    return { 
    stream: stateStream 
    } 
} 

कोड अलगाव में ज्यादा कहना नहीं कर सकते हैं, यह दिखाता है कि आप राज्य को ऊपर की ओर का निर्माण कर सकते हैं, और कैसे आप आसानी से गतिशील घटनाओं का उत्पादन कर सकते हैं। भुगतान करने की कीमत यह है कि आपको कोड की एक अलग शैली को समझने की आवश्यकता है। और मुझे वह कीमत चुकाना अच्छा लगता है।

Answer 4

You can "implement" Redux in one line of RxJS। यदि आप आरएक्स के अन्य कारणों (त्वचा के वादे के लिए, सर्वर और क्लाइंट पर इसका उपयोग करने के लिए) के बारे में सोच रहे हैं, तो रेडक्स छोड़ें और सभी आरएक्स पर जाएं।