🤷🏻 🐆 🐈 Dojo बिल्ड सिस्टम, स्वयं के निर्माण का अनुभव 🙊 👩🏽‍🍳 👡

Dojo अपनी सभी शक्ति और सकारात्मक गुणों के बावजूद, सबसे लोकप्रिय जावास्क्रिप्ट फ्रेमवर्क नहीं है। आज मैं पाठक को जो जानकारी देना चाहता हूं, वह इस तकनीक के उपयोग से निर्मित हर परियोजना के लिए आवश्यक है।

और हम बिल्ड सिस्टम के बारे में बात करेंगे।

यह क्या है और इसकी आवश्यकता क्यों है

समुदाय हमें ऑफ-द-शेल्फ अनुकूलित रिलीज़ प्रदान करता है, जिसे सर्वर पर होस्ट करने और वेब एप्लिकेशन में उपयोग करने के लिए डिज़ाइन किया गया है। Dojo.require () के माध्यम से आवश्यक मॉड्यूल कनेक्ट करके, हम आवश्यक संसाधनों को प्राप्त करने के लिए तुल्यकालिक HTTP GET अनुरोध आरंभ करते हैं। चूंकि ब्राउज़र प्रत्येक कॉल के पूरा होने की उम्मीद करता है, इसलिए पृष्ठ लोड समय को गंभीरता से बढ़ाया जाता है। तथाकथित "परतें" (इसके बाद बस परतों के रूप में संदर्भित) हमें संसाधनों के कनेक्शन को अनुकूलित करने में मदद करेगी।

अपनी खुद की विधानसभा बनाने के लिए डोजो निर्माण प्रणाली का उपयोग करने के कार्य:

उपयोग किए गए मॉड्यूल की एक परत बनाना। सभी आवश्यक मॉड्यूल 1 फ़ाइल में एकत्र किए जाएंगे, जो पृष्ठों के उद्घाटन में काफी तेजी लाएंगे
यदि dojo मॉड्यूल के कोड में परिवर्तन आवश्यक है, तो हम हमेशा स्रोत कोड (dojo के src संस्करण) के साथ ही काम करेंगे
इस तरह के परिवर्तनों की उपस्थिति में, उन्हें अगले अपडेट में एकीकृत करने की कार्रवाई कम से कम की जाती है

विधानसभा बनाने के लिए आपको क्या चाहिए

Dojo का src संस्करण, जिसे डाउनलोड पृष्ठ पर पाया जा सकता है
JRE 1.5 और उच्चतर
वैकल्पिक रूप से, हमारे अपने संसाधन (जेएस, सीएसएस, आदि) जिन्हें हम विधानसभा में शामिल करना चाहते हैं।
प्रोफाइल - एक जेएस फ़ाइल जो एक नई विधानसभा के निर्माण का वर्णन करती है।
मोजिला फाउंडेशन का राइनो इंजन। डोजो ने इसे अपनी बिल्ड यूटिलिटीज में नहीं डाला, हालांकि वह सक्रिय रूप से इसका संदर्भ देता है। आप इसे मोज़िला वेबसाइट पर ले सकते हैं

परतें बनाएं

असेंबली तैयार करने के चरण में एक कॉन्फ़िगरेशन फ़ाइल है जिसमें हमारे द्वारा आवश्यक कनेक्शन शामिल हैं। उदाहरण के लिए, एक मुख्य परत बनाएं जो एक वेब परियोजना के सभी पृष्ठों पर जुड़ा होगा, इसे कॉमनलेयर कहेंगे। js।

dojo.provide("ourcompany.commonlayer"); //  dojo.require("dojo.parser"); dojo.require("dojo.NodeList-fx"); dojo.require("dojo.data.ItemFileReadStore"); dojo.require("dojox.data.AndOrReadStore"); dojo.require("dojo.back"); dojo.require("dojox.fx._base"); dojo.require("dojo.cookie"); // dojo.require("ourcompany.shadow");

ourcompany.shadow - मान लीजिए कि यह हमारा अपना मॉड्यूल है, जो dojo.fx.shadow छाया का अनुकूलन है जिसे हम उपयोग करना चाहते हैं।

और तुलना के लिए, dijit के साथ काम करने के लिए एक अतिरिक्त परत। संपादक संपादक:

 dojo.provide("ourcompany.editorlayer"); //     dojo.require("dijit.Editor"); dojo.require("dijit._editor.plugins.FontChoice"); dojo.require("dijit._editor.plugins.TextColor"); dojo.require("dijit._editor.plugins.EnterKeyHandling"); // dojo.require("ourcompany.dijit._editor.plugins.LinkDialog");

हमने अपनी जरूरतों के लिए LinkDialog लिंक सम्मिलन प्लगइन को बदल दिया। हम इसे मानक विधानसभा से बाहर निकालते हैं और इसे अपने तरीके से कहते हैं, जैसा कि छाया के साथ होता है। नाम बदलना सरल है: प्लगइन का स्रोत js कोड एक नई घोषणा के साथ एक पंक्ति जोड़ता है, उदाहरण के लिए:

 dojo.provide("ourcompany.dijit._editor.plugins.LinkDialog");

जहाँ हमारा नाम।

प्रोफ़ाइल निर्माण

परतों.प्रोफाइल.जेएस प्रोफ़ाइल निर्भरता वस्तु में आवश्यक परतों और नामकरण क्षेत्रों का वर्णन करती है:

  dependencies = { layers: [ //    { name: "../ourcompany/commonlayer.js", resourceName: "ourcompany.commonlayer", dependencies: [ "ourcompany.commonlayer" ] }, { name: "../ourcompany/editorlayer.js", resourceName: "ourcompany.editorlayer", dependencies: [ "ourcompany.editorlayer" ] } ], prefixes: [ // ,    /dojo,      //ourcompany -       [ "dijit", "../dijit" ], [ "dojox", "../dojox" ], [ "ourcompany", "../ourcompany" ] ] }

ऐसी फ़ाइल केवल अनुकूलित 2 परतें बनाएगी, बाकी फाइलें बिना किसी बदलाव के बस असेंबली के दौरान कॉपी की जाती हैं। लेकिन हम उन्हें आधिकारिक रिलीज से ले सकते हैं। शायद किसी को प्रोफ़ाइल को पूरक करने की इच्छा होगी ताकि यह पूरी तरह से डोजो विधानसभा बना सके, मैंने नहीं किया।

हम जमा करते हैं

डोजो के src संस्करण में एक विशेष उपयोग डैड है जहां आप स्क्रिप्ट का निर्माण कर सकते हैं और कोड को ओफ़्फ़ुसेटिंग (ऑप्टिमाइज़ करना) के लिए श्रिंकसफ़ उपयोगिता का निर्माण कर सकते हैं। लेकिन अपने आप को चापलूसी मत करो, "बॉक्स से बाहर" यह काम नहीं करता है। मुझे इसमें जीत हासिल करनी थी। Dojo, build.bat और linux के माध्यम से build.sh के माध्यम से विंडोज के लिए दो बिल्ड विकल्प प्रदान करता है। मैंने अपने कंप्यूटर पर, खिड़कियों में विधानसभा को बाहर किया।

बिल्ड प्रक्रिया में ही \ use \ builddscripts \ build.bat फ़ाइल लॉन्च होती है। इसे सही -क्लासपथ के साथ संपादित करें:

java -classpath "../rhino/js.jar;../shrinksafe/js.jar;../shrinksafe/shrinksafe.jar" org.mozilla.javascript.tools.shell.Main build.js %*
pause

जहाँ रवा जावा इंजन है जिसका मैंने ऊपर उल्लेख किया है।

MakeRelease.bat फ़ाइल के माध्यम से मापदंडों को निर्दिष्ट करके विधानसभा को चलाना सुविधाजनक है। मैंने इसे इस तरह से किया है, लेकिन मैं बैच फ़ाइलों को लिखने में विशेषज्ञ नहीं हूं, मुझे लगता है कि आप अधिक सुरुचिपूर्ण होंगे:

@echo off

E:
cd \js\dojoroot

set FLDR=E:\js\dojoroot
echo buid root directory: %FLDR%

cd %FLDR%\dojo-release-1.6.0-src\util\buildscripts
build.bat action=clean,release profileFile=%FLDR%\layers.profile.js version=ourcompany-1.6.0/2 releaseName=

फ़ाइल सिस्टम पर, यह इस तरह दिखता है:
dojoroot निर्देशिका

जैसा कि आप देख सकते हैं, मैंने स्रोत से असेंबली, "डोज़ो-रिलीज़-1.6.0-src" निर्देशिका बनाई, जिसमें मैंने "मॉड्यूल और संसाधनों के साथ" हमारे कंप्यूटर फ़ोल्डर को रखा। Build.bat को चलाने के लिए, मैं निम्नलिखित तर्कों का उपयोग करता हूं:

कार्रवाई - आवश्यक कार्य, स्वच्छ - पुराने विधानसभा निर्देशिका को साफ़ करें, जारी करें - विधानसभा बनाएं
प्रोफाइलफाइल - प्रोफाइल का रास्ता
संस्करण - विधानसभा का संस्करण, dojo.version के माध्यम से लौटना संभव होगा
रिलीज़नाम - मेरे पास एक खाली है यदि सेट किया गया है, तो आपके नाम के साथ एक उपनिर्देशिका रिलीज़ फ़ोल्डर में दिखाई देगी

तर्कों की पूरी सूची प्रलेखन में है ।

विधानसभा को पूरा करने के बाद, निर्देशिका फार्म लेगी:
स्रोत और रिलीज के साथ निर्देशिका

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

परतों को प्रोजेक्ट पेज से कनेक्ट करें:

 <!--       dojo:--> <script type="text/javascript" src="dojo/dojo.js"></script> <!--       : --> <script type="text/javascript" src="ourcompany/commonlayer.js"></script> <!--  ,   , : --> <script type="text/javascript" src="ourcompany/editorlayer.js"></script>

परतों के साथ काम dojo.require () के माध्यम से मॉड्यूल के साथ मानक काम को बाहर नहीं करता है। यह ध्यान दिया जाना चाहिए कि कनेक्ट करने से पहले dojo.require () यह जांचता है कि क्या ऐसा मॉड्यूल पहले से कनेक्ट किया गया है और पुन: संयोजन को रोकता है।

परिणाम

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

सभी पृष्ठों की लोडिंग गति में काफी वृद्धि हुई। फायरबग की व्यक्तिगत टिप्पणियों और webpagetest.org बेंचमार्क डाउनलोड का समय लगभग एक सेकंड कम हो गया है
प्रोजेक्ट के मुख्य पृष्ठ पर, जहाँ संपादक का उपयोग नहीं किया जाता है, 129 लगातार HTTP GET अनुरोध एक (sic) में बदल गया!
परियोजना डोजो 1.4 से संस्करण 1.6 तक उन्नयन से बच गई, और अब प्रत्येक नए संस्करण में अपग्रेड करना आसान होगा

पीएस डोजो मॉड्यूल में बदलाव करना अक्सर कुछ निर्भरता कठिनाइयों को पूरा करता है। उदाहरण के लिए, जब dijit.Editor के लिए LinkDialog.js प्लगइन बदल रहा है, जिसे हमने असेंबली में शामिल किया है, तो यह आवश्यक था कि मानक फ़ाइलें ourcompany \ dijit \ nls \ ru \ common.js (लोडिंग .js) को हमारे कंप्यूटर फ़ोल्डर के src संस्करण में जोड़ा जाए। इस हेरफेर के बिना, Editorlayer.js परत विफल हो जाएगी।

विधानसभा निर्माण तंत्र का अध्ययन करते समय, मैंने आधिकारिक डोजो टूलकिट वेबसाइट पर प्रलेखन का उपयोग किया:
http://dojotoolkit.org/reference-guide/build/
http://dojotoolkit.org/reference-guide/build/simpleExample.html
http://dojotoolkit.org/reference-guide/build/buildScript.html