विषय
- 01. कोणीय
- 02. प्रतिक्रिया
- 03. व्यू
- ढांचे के वाक्यविन्यास की तुलना कैसे होती है?
- लोकप्रियता और बाजार
- मोबाइल ऐप डेवलपमेंट
- 2020 में देखने के लिए अन्य रूपरेखा
- निष्कर्ष
2020 में, हमें वेब विकास में मदद करने के लिए कई रूपरेखाओं और पुस्तकालयों का आशीर्वाद मिला है। लेकिन हमेशा इतनी विविधता नहीं थी। 2005 में वापस, मोचा नामक एक नई स्क्रिप्टिंग भाषा ब्रेंडन ईच नाम के एक व्यक्ति द्वारा बनाई गई थी। लाइवस्क्रिप्ट का नाम बदलने के महीनों बाद, नाम को फिर से जावास्क्रिप्ट में बदल दिया गया। तब से, जावास्क्रिप्ट एक लंबा सफर तय कर चुका है।
2010 में, हमने पहले जावास्क्रिप्ट ढांचे के रूप में बैकबोन और एंगुलर की शुरुआत देखी और 2016 तक, सभी वेबसाइटों में से 92 प्रतिशत ने जावास्क्रिप्ट का उपयोग किया। इस लेख में, हम तीन मुख्य जावास्क्रिप्ट ढांचे (एंगुलर, रिएक्ट और वीयू) पर एक नज़र डालने जा रहे हैं और उनकी स्थिति अगले दशक में बढ़ रही है। अपनी खुद की साइट बनाना चाहते हैं? वेबसाइट बनाने वालों की इस सूची को आजमाएं।
कुछ शानदार संसाधनों के लिए, शीर्ष वेब डिज़ाइन टूल की हमारी सूची, वेब होस्टिंग सेवाओं का हमारा राउंडअप, और उत्कृष्ट उपयोगकर्ता परीक्षण सॉफ़्टवेयर की यह सूची भी देखें।
01. कोणीय
AngularJS को 2010 में जारी किया गया था, लेकिन 2016 तक इसे पूरी तरह से फिर से लिखा गया और Angular 2 के रूप में जारी किया गया। Angular Google द्वारा विकसित एक पूर्ण विकसित वेब फ्रेमवर्क है, जिसका उपयोग Wix, Upwork, The Guardian, HBO और अन्य द्वारा किया जाता है।
पेशेवरों:
- टाइपस्क्रिप्ट के लिए असाधारण समर्थन
- एमवीवीएम डेवलपर्स को डेटा के समान सेट का उपयोग करके एक ही ऐप सेक्शन पर काम को अलग करने में सक्षम बनाता है
- उत्कृष्ट दस्तावेज
विपक्ष:
- थोड़ा सीखने की अवस्था है
- पुराने संस्करण से माइग्रेट करना मुश्किल हो सकता है।
- अपडेट काफी नियमित रूप से पेश किए जाते हैं जिसका अर्थ है कि डेवलपर्स को उनके अनुकूल होने की आवश्यकता है
आगे क्या होगा?
कोणीय 9 में, आइवी डिफ़ॉल्ट संकलक है। इसे प्रदर्शन और फ़ाइल आकार के आसपास के कई मुद्दों को हल करने के लिए रखा गया है। इसे अनुप्रयोगों को छोटा, तेज और सरल बनाना चाहिए।
जब आप एंगुलर के पिछले संस्करणों की तुलना रिएक्ट और वीयू से करते हैं, तो
कोणीय का उपयोग करते समय अंतिम बंडल आकार बहुत बड़ा था। आइवी प्रोग्रेसिव हाइड्रेशन को भी संभव बनाता है, जो कि एंगुलर टीम ने I/O 2019 में दिखाया है। प्रोग्रेसिव हाइड्रेशन सर्वर और क्लाइंट पर उत्तरोत्तर लोड करने के लिए आइवी का उपयोग करता है। उदाहरण के लिए, एक बार जब कोई उपयोगकर्ता किसी पृष्ठ के साथ इंटरैक्ट करना शुरू करता है, तो किसी भी रनटाइम के साथ घटकों का कोड टुकड़े-टुकड़े करके प्राप्त किया जाता है।
आइवी एंगुलर के लिए आगे बढ़ने वाले बड़े फोकस की तरह लगता है और उम्मीद है कि इसे सभी ऐप्स के लिए उपलब्ध कराया जाएगा। संस्करण 9 में एंगुलर 10 के माध्यम से सभी तरह से एक ऑप्ट-आउट विकल्प होगा।
02. प्रतिक्रिया
रिएक्ट शुरू में 2013 में फेसबुक द्वारा जारी किया गया था और इसका उपयोग इंटरैक्टिव वेब इंटरफेस के निर्माण के लिए किया जाता है। इसका उपयोग नेटफ्लिक्स, ड्रॉपबॉक्स, पेपाल और उबर द्वारा कुछ नामों के लिए किया जाता है।
पेशेवरों:
- रिएक्ट वर्चुअल डोम का उपयोग करता है, जिसका प्रदर्शन पर सकारात्मक प्रभाव पड़ता है
- JSX लिखना आसान है
- अपडेट स्थिरता से समझौता नहीं करते
विपक्ष:
- मुख्य असफलताओं में से एक को अधिक जटिल ऐप्स बनाने के लिए तृतीय-पक्ष पुस्तकालयों की आवश्यकता है
- विकास के सर्वोत्तम तरीके पर डेवलपर्स को अंधेरे में छोड़ दिया जाता है
आगे क्या होगा?
रिएक्ट कॉन्फ 2019 में, रिएक्ट टीम ने उन कई चीजों को छुआ, जिन पर वे काम कर रहे हैं। पहला सेलेक्टिव हाइड्रेशन है, जहां रिएक्ट जो कुछ भी काम कर रहा है उसे रोक देगा ताकि उपयोगकर्ता के साथ इंटरैक्ट करने वाले घटकों को प्राथमिकता दी जा सके। जैसे ही उपयोगकर्ता किसी विशेष खंड के साथ बातचीत करने जाता है, वह क्षेत्र हाइड्रेटेड हो जाएगा। टीम सस्पेंस पर भी काम कर रही है, जो कोड, डेटा और छवियों के लोडिंग को व्यवस्थित करने के लिए रिएक्ट की प्रणाली है। यह घटकों को प्रस्तुत करने से पहले किसी चीज़ की प्रतीक्षा करने में सक्षम बनाता है।
चयनात्मक हाइड्रेशन और सस्पेंस दोनों को समवर्ती मोड द्वारा संभव बनाया गया है, जो उपयोगकर्ता इनपुट पर प्रतिक्रिया देने जैसी उच्च प्राथमिकता वाली किसी चीज़ पर ध्यान केंद्रित करने के लिए रिएक्ट को कम प्राथमिकता वाले काम के बड़े ब्लॉक में प्रवेश करने की क्षमता देकर ऐप्स को अधिक प्रतिक्रियाशील बनाने में सक्षम बनाता है। टीम ने दो विशेष विषयों पर ध्यान केंद्रित करके एक अन्य क्षेत्र के रूप में एक्सेसिबिलिटी का भी उल्लेख किया है - फोकस और इनपुट इंटरफेस का प्रबंधन।
03. व्यू
Vue को 2014 में Google के एक पूर्व कर्मचारी, Evan You द्वारा विकसित किया गया था। इसका उपयोग Xiaomi, अलीबाबा और GitLab द्वारा किया जाता है। Vue कम समय में और एक प्रमुख ब्रांड के समर्थन के बिना डेवलपर्स से लोकप्रियता और समर्थन हासिल करने में कामयाब रहा।
पेशेवरों:
- आकार में बहुत हल्का
- शुरुआत के अनुकूल - सीखने में आसान
- महान समुदाय
विपक्ष:
- फेसबुक के साथ रिएक्ट और गूगल के साथ एंगुलर जैसी बड़ी कंपनी द्वारा समर्थित नहीं है
- कोई वास्तविक संरचना नहीं
आगे क्या होगा?
Vue ने खुद को तेज, छोटा, अधिक बनाए रखने योग्य और डेवलपर्स के लिए देशी को लक्षित करना आसान बनाने का लक्ष्य निर्धारित किया है (यदि आपको बनाए रखने में समस्या हो रही है, तो वेब होस्टिंग सेवा पर विचार करें)। अगली रिलीज़ (3.0) Q1 2020 में होने वाली है, जिसमें बेहतर टाइपस्क्रिप्ट समर्थन के साथ बेहतर प्रदर्शन के लिए वर्चुअल DOM रीराइट शामिल है। इसमें कंपोजिशन एपीआई भी शामिल है, जो डेवलपर्स को कंपोनेंट्स बनाने और ऑपरेशन के बजाय फीचर द्वारा उन्हें व्यवस्थित करने का एक नया तरीका प्रदान करता है।
Vue विकसित करने वाले भी सस्पेंस पर काम करने में व्यस्त हैं, जो आपके घटक प्रतिपादन को निलंबित कर देता है और एक शर्त पूरी होने तक फ़ॉलबैक घटक प्रस्तुत करता है।
Vue के अपडेट के साथ सबसे अच्छी चीजों में से एक यह है कि वे पश्चगामी संगतता बनाए रखते हैं। वे नहीं चाहते कि आप अपने पुराने Vue प्रोजेक्ट को तोड़ें। हमने इसे 1.0 से 2.0 के प्रवास में देखा जहां एपीआई का 90 प्रतिशत समान था।
ढांचे के वाक्यविन्यास की तुलना कैसे होती है?
रिलीज के बाद से सभी तीन रूपरेखाओं में बदलाव आया है, लेकिन एक चीज जो समझने के लिए महत्वपूर्ण है वह है वाक्य रचना और यह कैसे भिन्न है। आइए एक नज़र डालते हैं कि जब साधारण ईवेंट बाइंडिंग की बात आती है तो सिंटैक्स की तुलना कैसे होती है:
दृश्य: वि पर निर्देश का उपयोग ईवेंट श्रोताओं को संलग्न करने के लिए किया जाता है जो Vue इंस्टेंस पर विधियों का आह्वान करते हैं। निर्देश उपसर्ग के साथ हैं वी यह इंगित करने के लिए कि वे Vue द्वारा प्रदान की गई विशेष विशेषताएँ हैं और प्रदान किए गए DOM पर विशेष प्रतिक्रियाशील व्यवहार लागू करते हैं। इवेंट हैंडलर को या तो इनलाइन या विधि के नाम के रूप में प्रदान किया जा सकता है।
टेम्प्लेट> बटन वी-ऑन: क्लिक = "क्लिकहैंडलर"> मुझे क्लिक करें / बटन> / टेम्पलेट> स्क्रिप्ट> निर्यात डिफ़ॉल्ट {नाम: "हैलोवर्ल्ड", विधियाँ: {क्लिकहैंडलर: फ़ंक्शन () { कंसोल.लॉग ("मुझे क्लिक किया गया था! "); } } }; /स्क्रिप्ट>
प्रतिक्रिया: रिएक्ट JS और JSX में मार्क अप और लॉजिक डालता है, जो जावास्क्रिप्ट का सिंटैक्स एक्सटेंशन है। JSX के साथ, फ़ंक्शन को ईवेंट हैंडलर के रूप में पास किया जाता है। रिएक्ट तत्वों के साथ घटनाओं को संभालना डीओएम तत्वों पर घटनाओं को संभालने के समान ही है। लेकिन कुछ वाक्यात्मक अंतर हैं; उदाहरण के लिए, रिएक्ट इवेंट को लोअरकेस के बजाय कैमलकेस का उपयोग करके नाम दिया गया है।
फ़ंक्शन बटन () {फ़ंक्शन क्लिकहैंडलर (ई) {कंसोल.लॉग ("मुझे क्लिक किया गया था"); } रिटर्न बटन ऑनक्लिक={क्लिकहैंडलर}>मुझे क्लिक करें!/बटन>; }
कोणीय: इवेंट बाइंडिंग सिंटैक्स में एक समान चिह्न के बाईं ओर कोष्ठक के भीतर एक लक्ष्य ईवेंट नाम और दाईं ओर एक उद्धृत टेम्पलेट स्टेटमेंट होता है। वैकल्पिक रूप से, आप का उपयोग कर सकते हैं पर- उपसर्ग, जिसे विहित रूप के रूप में जाना जाता है।
@ कॉम्पोनेंट ({चयनकर्ता: "ऐप-क्लिक-मी", टेम्प्लेट: `बटन (क्लिक करें) = "ऑनक्लिकमी ()"> मुझे क्लिक करें!/बटन> `}) निर्यात वर्ग क्लिकमेकंपोनेंट {ऑनक्लिकमे () { कंसोल.लॉग (" आपने मुझे क्लिक किया!"); } }
लोकप्रियता और बाजार
आइए W3Tech के आँकड़ों की जाँच करके शेष वेब के संबंध में तीन रूपरेखाओं की एक समग्र तस्वीर को देखकर शुरू करें। वर्तमान में सभी वेबसाइटों के 0.4 प्रतिशत द्वारा कोणीय का उपयोग किया जाता है, जिसमें जावास्क्रिप्ट पुस्तकालय बाजार हिस्सेदारी 0.5 प्रतिशत है। रिएक्ट का उपयोग सभी वेबसाइटों के 0.3 प्रतिशत और जावास्क्रिप्ट पुस्तकालय बाजार हिस्सेदारी के 0.4 प्रतिशत द्वारा किया जाता है और दोनों के लिए Vue का 0.3 प्रतिशत है। यह काफी सम लगता है और आप संख्या बढ़ने की उम्मीद करेंगे।
गूगल ट्रेंड्स: पिछले 12 महीनों में, रिएक्ट खोज शब्दों में सबसे लोकप्रिय है, इसके बाद एंगुलर है। Vue.js काफी पीछे है; हालाँकि, एक बात याद रखने वाली है कि अन्य दो की तुलना में Vue अभी भी युवा है।
नौकरी खोज: लेखन के समय, रिएक्ट और एंगुलर जॉब लिस्टिंग के मामले में काफी हद तक एक-दूसरे से काफी पीछे हैं। हालांकि, लिंक्डइन पर, वू डेवलपर्स की अधिक मांग प्रतीत होती है।
स्टैक ओवरफ़्लो: यदि आप 2019 के स्टैक ओवरफ्लो डेवलपर सर्वेक्षण परिणामों को देखें, तो रिएक्ट और Vue.js दोनों ही सबसे पसंदीदा और वांछित वेब फ्रेमवर्क हैं। एंगुलर मोस्ट लव्ड लेकिन थर्ड मोस्ट वांटेड के लिए नौवें स्थान पर बैठता है।
गिटहब: Vue में 153k के साथ सबसे अधिक सितारे हैं लेकिन इसमें योगदानकर्ताओं की संख्या सबसे कम (283) है। दूसरी ओर रिएक्ट में 140k सितारे और 1,341 योगदानकर्ता हैं। कोणीय में केवल 59.6k सितारे हैं, लेकिन 1,579 के साथ तीनों में से सबसे अधिक योगदानकर्ता हैं।
एनपीएम रुझान: ऊपर दी गई छवि पिछले 12 महीनों के आंकड़े दिखाती है, जहां आप देख सकते हैं कि रिएक्ट में एंगुलर और वीयू की तुलना में प्रति माह डाउनलोड की संख्या अधिक है।
मोबाइल ऐप डेवलपमेंट
बिग थ्री के लिए एक मुख्य फोकस मोबाइल परिनियोजन है। रिएक्ट में रिएक्ट नेटिव है, जो न केवल रिएक्ट उपयोगकर्ताओं के लिए बल्कि व्यापक ऐप डेवलपमेंट कम्युनिटी के लिए भी आईओएस और एंड्रॉइड ऐप बनाने के लिए एक लोकप्रिय विकल्प बन गया है। कोणीय डेवलपर्स देशी ऐप्स के लिए नेटिवस्क्रिप्ट या हाइब्रिड मोबाइल ऐप के लिए आयोनिक का उपयोग कर सकते हैं, जबकि Vue डेवलपर्स के पास नेटिवस्क्रिप्ट या Vue नेटिव का विकल्प होता है। मोबाइल एप्लिकेशन की लोकप्रियता के कारण, यह निवेश का एक प्रमुख क्षेत्र बना हुआ है।
2020 में देखने के लिए अन्य रूपरेखा
यदि आप 2020 में कुछ नया करने की कोशिश करना चाहते हैं, तो इन जावास्क्रिप्ट ढांचे को देखें।
एम्बर: वेब अनुप्रयोगों के निर्माण के लिए एक खुला स्रोत ढांचा जो एमवीवीएम पैटर्न के आधार पर काम करता है। इसका इस्तेमाल माइक्रोसॉफ्ट, नेटफ्लिक्स और लिंक्डइन जैसी कई बड़ी कंपनियां करती हैं।
उल्का: आधुनिक वेब और मोबाइल एप्लिकेशन विकसित करने के लिए एक पूर्ण-स्टैक जावास्क्रिप्ट प्लेटफॉर्म। यह सीखना आसान है और इसमें एक बहुत ही सहायक समुदाय है।
निष्कर्ष
तीनों ढांचे में लगातार सुधार हो रहा है, जो एक उत्साहजनक संकेत है। हर किसी का अपना दृष्टिकोण और पसंदीदा समाधान होता है जिसके बारे में उन्हें उपयोग करना चाहिए लेकिन यह वास्तव में परियोजना के आकार के लिए नीचे आता है और जो आपको अधिक सहज महसूस कराता है।
सबसे महत्वपूर्ण पहलू उनके समुदायों का निरंतर समर्थन है, इसलिए यदि आप एक नई परियोजना शुरू करने की योजना बना रहे हैं और पहले कभी भी तीनों में से किसी का भी उपयोग नहीं किया है, तो मेरा मानना है कि आप उन सभी के साथ सुरक्षित हाथों में हैं। यदि आपको अभी तक तीन में से कोई भी ढांचा सीखने का मौका नहीं मिला है, तो मेरा सुझाव है कि इसे सीखना शुरू करने के लिए इसे अपने नए साल का संकल्प बनाएं। भविष्य इन्हीं तीनों के इर्द-गिर्द घूमेगा।
यह सामग्री मूल रूप से नेट पत्रिका में छपी थी।
