आरआईए परियोजनाओं का मॉड्यूलर डिजाइन

बड़ी परियोजनाओं के विकास में समस्याएं

प्रदर्शन, डिजाइन, बाइक से डेटा कटलेट का पृथक्करण ... मुख्य बात कट्टरता के बिना है। RIA अनुप्रयोगों को विकसित करते समय अक्सर क्या समस्या आती है। एक मजबूत प्रोजेक्टर्स की एक टीम एक नई परियोजना के साथ "प्यार में पड़ती है", और विचारों के साथ "अब हम कुछ करेंगे - मुख्य बात यह है कि सब कुछ खुद करना है ताकि किसी और का बग अंदर न हो" तैयार फ्रेमवर्क, पुस्तकालयों, समाधानों को छोड़ना शुरू करें।
सच है, इस प्रवृत्ति के लिए एक तार्किक व्याख्या है, किसी और के उत्पाद में उलझने का डर है, ऐसा होता है कि विकास के दौरान यह पता चलता है कि इस तरह के एक इंटरफ़ेस को सुलभ उपकरण, और बैसाखी, अन्य लोगों के ढांचे के संपादन, आदि को विकसित करना बहुत मुश्किल है। मैं इस समस्या के समाधान का प्रस्ताव देना चाहूंगा। इंटरफेस (मॉड्यूल) के प्रबंधक का निर्माण। एक मॉड्यूल ExtJS, एक और dhtmlx, या शायद शुद्ध जावास्क्रिप्ट का भी उपयोग कर सकता है

अजनबी नहीं - लेकिन खुला

तैयार समाधानों का उपयोग करने के क्या फायदे हैं? जब आप किसी प्रसिद्ध तृतीय-पक्ष उत्पाद का उपयोग करते हैं, तो प्रोजेक्ट के लिए एक नया व्यक्ति ढूंढना आसान होता है। ऐसी स्थिति में जब आप रूपरेखा के रचनाकारों में से केवल एक होते हैं और छोड़ने का निर्णय लेते हैं, तो सबसे अधिक संभावना है कि नई टीम खरोंच से सब कुछ फिर से लिख देगी। जब आप व्यावसायिक तर्क पर काम कर रहे हों, तो बग को संपादित करना और नई सुविधाओं को जोड़ना। यदि आप प्रस्तुति से डेटा को अलग करने में एक शक्तिशाली हथियार चाहते हैं - उदाहरण के लिए एक्सटीजेएस का उपयोग करें, तो अपनी खुद की रूपरेखा क्यों लिखें! आपको गतिशील रूप से निर्भरता लोड करने की आवश्यकता है - येपनोप की ओर देखें। डोम के साथ काम करें, jQuery या किसी अन्य प्रसिद्ध ढांचे को प्रदान करें। परिणाम पर ध्यान दें। मैं समझता हूं कि अधिकांश प्रोग्रामर खरोंच से सब कुछ लिखना पसंद करते हैं - लेकिन ऐसा इसलिए नहीं है क्योंकि वह सीखना चाहता है, विकसित करना है ... यह आलस्य से है ... हां, यह आलस्य से है। किसी और के कोड का अध्ययन करना, प्रलेखन पढ़ना सब कुछ खरोंच से विकसित करने की तुलना में अधिक जटिल है। जब आप "खरोंच से" सब कुछ लिखते हैं, तो आप बहुत कुछ नहीं सीखते हैं, लोग मुख्य रूप से दूसरों से सीखते हैं, किसी और के काम पर शोध करते समय, आप अनुभव से सीख रहे हैं ( यह आपके प्रतिद्वंद्वी के जिगर खाने की तरह है ), और साथ में आपके अनुभव के साथ आप कुछ और सीखेंगे ... और अधिक सही। नए ब्राउज़र IE6 , IE7 , IE8 , IE9 के रिलीज के बाद अपने अगले मेगा-फ्रेम के संपादन में खुदाई करने से अधिक मान्यता प्राप्त होगी।
यदि आपका लक्ष्य अपनी खुद की रूपरेखा लिखना है, तो एक ईआरपी विकसित करने के बजाय जिसके लिए आपको 2 महीने की अवधि दी गई थी, तो ओएस ... या प्रोसेसर आर्किटेक्चर के साथ शुरू करें ... क्यों नहीं?

कई रोगों के इलाज के रूप में मॉड्यूलरिटी

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

कोर सब कुछ का प्रमुख है

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

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

GitHub पर पूरा प्रोजेक्ट कोड देखें

कर्नेल का एक सरलीकृत संस्करण:

/*=== core.js ===*/ !function () { var listOfLibraries = {}; $(window).resize(function() { $.each(listOfLibraries, function(){ this.body.onResize($(window).width(), $(window).height()); }); }); $("script[id=core]").bind('request', function (data) { switch (data.header) { case "attach": var library = { name: data.body.name, body: new data.body.module() }; listOfLibraries[library.name] = library; $('<div id="'+library.name+'"></div>').appendTo('body'); var moduleContext = $('#'+library.name); library.body.main(moduleContext); break; } }); }(); 

लोड करने के बाद, कर्नेल अनुरोध संदेश चैनल के लिए सुनता है; जब एक नया मॉड्यूल जुड़ा होता है, तो यह सूचीऑफ लाइब्रेरीज़ संग्रह में जोड़ता है। यह संग्रह सभी लोड किए गए मॉड्यूल को संग्रहीत करता है।

मॉड्यूल को स्वतंत्रता दें!

मॉड्यूल उदाहरण:

 /*=== HelloWorld.js ===*/ !function () { var Lib = function () { var context; this.main = function (moduleContext) { context = moduleContext; context.html('Hello World'); } this.onResize = function(width, height){ context.width(width); context.height(height); } } $("script[id=core]").trigger({ type: "request", header: "attach", body: { module: Lib, name: "HelloWorld" } }); } (); 

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

 window.Module = function () { this.context; } window.Module.prototype = { main: function (context) { this.context = context; }, onResize: function (width, height) { } } 

किसी मॉड्यूल को कर्नेल से कनेक्ट करते समय, आपको केवल यह सुनिश्चित करने की आवश्यकता होती है कि प्लग-इन अमूर्त वर्ग मॉड्यूल की कार्यक्षमता को विरासत में देता है, यदि सफल होता है, तो इसे सिस्टम से कनेक्ट करें।
GitHub पर पूरा प्रोजेक्ट कोड देखें