बेसिक रंडाउन ऑफ रिएक्ट बनाम वीयू

फ़्लैटिरोन स्कूल में समय उड़ान भर रहा है। हमने रिएक्ट फ्रेमवर्क सीखने के साथ सिर्फ सप्ताह 10 को लपेटा। प्रतिक्रिया जावास्क्रिप्ट और जेएसएक्स (वेनिला जावास्क्रिप्ट का संयोजन और एक विशिष्ट सिंटैक्स जो HTML के समान दिखता है) से बना है। JSX एक प्रीप्रोसेसर स्टेप है जो XML सिंटेक्स को जावास्क्रिप्ट में जोड़ता है। आप निश्चित रूप से जेएसएक्स के बिना रिएक्ट का उपयोग कर सकते हैं लेकिन जेएसएक्स प्रतिक्रिया को बहुत अधिक सुरुचिपूर्ण बनाता है। जेएसएक्स के स्निपेट्स का उपयोग करके, आप उन घटकों का निर्माण कर सकते हैं जो एक वेब एप्लिकेशन के बिल्डिंग ब्लॉक बन जाते हैं। मैं वास्तव में इसे अब तक पसंद करता हूं, लेकिन अन्य रूपरेखाओं के साथ फायदे और नुकसान के बारे में उत्सुक था, विशेष रूप से Vue में।

प्रतिक्रिया के साथ, जब एक घटक अपनी स्थिति बदलता है तो यह पूरे घटक पेड़ के पुन: रेंडर को ट्रिगर करता है। इन री-रेंडर्स से निपटने के लिए आप या तो shouldComponentUpdate या React.PureComponent का उपयोग कर सकते हैं। यदि आप React.Component के बजाय React.PureComponent का उपयोग करते हैं तो यह स्वतः हीComComententUpdate को लागू करता है।

प्रतिक्रिया में, shouldComponentUpdate विधि का उपयोग केवल प्रदर्शन अनुकूलन के रूप में किया जाना चाहिए। यदि किसी घटक का आउटपुट राज्य या प्रॉप्स में वर्तमान परिवर्तन से प्रभावित नहीं होता है, तो रिएक्ट को बताने के लिए आप कंधे के नीचे के तरीके का उपयोग करें।

Vue में, Vue का सिस्टम जानता है कि राज्य में बदलाव होने पर किन घटकों को फिर से प्रस्तुत करना होगा। यह घटक के अनावश्यक पुन: प्रतिपादन को दूर करता है।

रिएक्ट और वी के साथ सबसे स्पष्ट अंतर वाक्यविन्यास के साथ हैं

जैसा कि पहले कहा गया था, रिएक्ट जावास्क्रिप्ट से बना है और (वैकल्पिक रूप से) जेएसएक्स घटकों को बनाने के लिए है जो एप्लिकेशन के बिल्डिंग ब्लॉक बन जाते हैं। Vue भी रेंडर कार्यों का उपयोग कर सकते हैं और JSX का समर्थन कर सकते हैं लेकिन वे डिफ़ॉल्ट टेम्प्लेट भी प्रदान करते हैं। मान्य HTML Vue में टेम्पलेट के रूप में कार्य करता है। इससे शुरुआती भी कोड के माध्यम से काम करने में सक्षम हो सकते हैं और इसे जोड़ सकते हैं क्योंकि यह पढ़ने और लिखने के लिए अधिक स्वाभाविक है। Vue में घटकों को प्रस्तुतिकरण या तार्किक के रूप में वर्णित किया जा सकता है। यह तर्कसंगत घटकों के लिए प्रस्तुतिकरण घटकों और JSX के साथ कार्यों को प्रस्तुत करने के लिए टेम्प्लेट का उपयोग करने के लिए अनुशंसित है।

रिएक्ट में CSS स्टाइलिंग ज्यादातर JS में CSS के रूप में की जाती है। Vue में डिफ़ॉल्ट स्टाइल विधि एकल-फ़ाइल घटकों में शैली टैग की तरह है। एकल-फ़ाइल घटकों में स्टाइलिंग कोड घटक कोड के समान फ़ाइल में है।

प्रतिक्रिया और Vue में कुछ समानताएँ भी हैं

बड़े अनुप्रयोगों के लिए, React और Vue अच्छे समाधान प्रदान करते हैं। Redux का उपयोग रिएक्ट के साथ राज्य के प्रबंधन और उसके उपयोगकर्ता के कार्यों का जवाब देने में किया जा सकता है। Vue Redux का उपयोग भी कर सकता है, लेकिन Vuex नाम की कोई चीज है जो विशेष रूप से Vue के लिए एक और विशिष्ट राज्य प्रबंध प्रणाली है। React और Vue के बीच एक और समानता उनका रनटाइम प्रदर्शन है। वे बहुत समान हैं इसलिए वहां कोई फायदा या नुकसान नहीं है।

क्या प्रतिक्रिया या Vue अधिक लोकप्रिय है?

राज्य प्रबंधन के लिए Vue के पुस्तकालयों को सभी मुख्य पुस्तकालय के साथ अद्यतन किया जाता है जबकि React अपने समुदाय का उपयोग करता है। प्रतिक्रिया हालांकि अधिक लोकप्रिय है, इसलिए यह चिंताओं को बनाए रखने में सक्षम है। एक StackOverflow सर्वेक्षण ने कहा कि रिएक्ट डेवलपर्स के बीच तीसरा सबसे लोकप्रिय पुस्तकालय है। लिंक्डइन के अनुसार, रिएक्टर डेवलपर्स 5: 1 अनुपात के साथ Vue की तुलना में अधिक मांग में हैं।

यदि आप रिएक्ट या Vue के लिए एक प्रोजेक्ट स्टार्टर चाहते हैं, तो आप भाग्य में हैं!

Vue और React दोनों ही प्रोजेक्ट स्टार्टर्स की पेशकश करते हैं। रिएक्ट क्रिएट-रिएक्शन-ऐप है जबकि Vue में एक CLI जेनरेटर है। रिएक्ट के प्रोजेक्ट स्टार्टर के लिए एक नुकसान यह है कि यह केवल एक ही टेम्पलेट प्रदान करता है, यह मानते हुए कि आप एक एसपीए (सिंगल पेज एप्लिकेशन) बना रहे हैं, जबकि Vue अधिक विविधता प्रदान करता है।

मेरी राय में, रिएक्ट में Vue की तुलना में एक स्टेटर सीखने की अवस्था है। Vue के साथ, आपको छोटे अनुप्रयोगों के निर्माण के लिए बस एक ही स्क्रिप्ट टैग लगाने की आवश्यकता है। प्रतिक्रिया के साथ आपको जावास्क्रिप्ट (ES2015 +) और JSX को जानने में सक्षम होना चाहिए।

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

इन दिनों आप अपने काम के लिए कौन सा फ्रंट-एंड टूल पसंद करते हैं? हैप्पी कोडिंग!

सूत्रों का कहना है: