बड़े जावास्क्रिप्ट ऐप्स को प्रबंधित और तैनात करने के लिए सर्वोत्तम अभ्यास

Question

मध्यम-बड़े जावास्क्रिप्ट एप्लिकेशन के प्रबंधन के लिए कुछ मानक अभ्यास क्या हैं? मेरी चिंता ब्राउज़र डाउनलोड और विकास की आसानी और रखरखाव के लिए दोनों गति है।

हमारे जावा स्क्रिप्ट कोड मोटे तौर पर के रूप में "namespaced" है:

var Client = { 
    var1: '', 
    var2: '', 

    accounts: { 
     /* 100's of functions and variables */ 
    }, 

    orders: { 
     /* 100's of functions and variables and subsections */ 
    } 

    /* etc, etc for a couple hundred kb */ 
} 

समय, हम एक (पैक, unstripped, अत्यधिक पठनीय) JavaScript फ़ाइल सभी व्यापार तर्क वेब अनुप्रयोग पर संभाल करने के लिए किया है। इसके अलावा, jQuery और कई jQuery एक्सटेंशन हैं। हमें जिस समस्या का सामना करना पड़ता है वह यह है कि जावास्क्रिप्ट कोड में कुछ भी ढूंढने के लिए हमेशा लेता है और ब्राउज़र में अभी भी डाउनलोड करने के लिए एक दर्जन फ़ाइलें हैं।

क्या यह "स्रोत" जावास्क्रिप्ट फाइलों का एक मुट्ठी भर है जो "अंतिम" संकुचित जावास्क्रिप्ट फ़ाइल में "संकलित" हो जाता है? कोई अन्य आसान संकेत या सर्वोत्तम प्रथाओं?

Answer 1

जिस दृष्टिकोण को मैंने पाया है, उसके लिए प्रत्येक वर्ग के लिए अलग जेएस फाइलें हैं (जैसे आप जावा, सी # और अन्य में)। वैकल्पिक रूप से आप अपने जेएस को एप्लिकेशन कार्यात्मक क्षेत्रों में समूहित कर सकते हैं यदि आपके लिए नेविगेट करना आसान हो।

यदि आप अपनी सभी जेएस फ़ाइलों को एक निर्देशिका में डालते हैं, तो आप उस निर्देशिका में प्रत्येक फ़ाइल के माध्यम से अपने सर्वर-साइड पर्यावरण (उदाहरण के लिए PHP) लूप कर सकते हैं और अपने सभी यूआई द्वारा शामिल कुछ हेडर फ़ाइल में <script src='/path/to/js/$file.js' type='text/javascript'> आउटपुट कर सकते हैं पृष्ठों की है। यदि आप नियमित रूप से जेएस फाइलें बना रहे हैं और निकाल रहे हैं तो आपको यह ऑटो-लोडिंग विशेष रूप से आसान लगेगी।

उत्पादन में तैनाती करते समय, आपके पास एक स्क्रिप्ट होनी चाहिए जो उन्हें सभी को एक जेएस फ़ाइल में जोड़ती है और आकार को कम रखने के लिए इसे "छोटा" करती है।

Answer 2

सर्वर दक्षता के लिए, अपने सभी जावास्क्रिप्ट को एक मिनी फ़ाइल में गठबंधन करना सबसे अच्छा है।

ऑर्डर निर्धारित करें जिसमें कोड आवश्यक है और फिर एक फ़ाइल में आवश्यक क्रम में मिनी कोड को रखें।

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

मैं फ़ाइलों को विकास के लिए विभाजित रखने की सलाह दूंगा और फिर सब कुछ गठबंधन/संकलित करने के लिए एक बिल्ड स्क्रिप्ट बनाएं।

इसके अलावा, अंगूठे के अच्छे नियम के रूप में, सुनिश्चित करें कि आप अपने जावास्क्रिप्ट को अपने पृष्ठ के अंत में शामिल करें। यदि जावास्क्रिप्ट हेडर (या पृष्ठ में कहीं भी कहीं भी) में शामिल है, तो यह अन्य सभी अनुरोधों को लोड होने तक रोक देगा, भले ही पाइपलाइनिंग चालू हो। यदि यह पृष्ठ के अंत में है, तो आपको यह समस्या नहीं होगी।

Answer 3

बस एक सिडेनोड - स्टीव पहले से ही इंगित करता है, आपको वास्तव में अपनी जेएस फाइलों को "छोटा" करना चाहिए। जेएस में, सफेद जगह वास्तव में मायने रखती है। यदि आपके पास जेएस की हजारों लाइनें हैं और आप केवल उन्हीं अपरिचित न्यूलाइन को पट्टी करते हैं जिन्हें आपने पहले ही 1 के बारे में सहेजा है। मुझे लगता है आपको बात समझ में आ गयी है।

इस नौकरी के लिए उपकरण हैं। और आपको कभी भी "minified"/stripped/obfuscated JS को हाथ से संशोधित नहीं करना चाहिए! कभी नहीँ!

Answer 4

विटामिन पर एक उत्कृष्ट लेख फ़्लिकर प्रसिद्धि के काल हेंडरसन ने कैसे वे अपने सीएसएस और जावास्क्रिप्ट के वितरण का अनुकूलन पर नहीं है: http://www.iamcal.com/serving-javascript-fast/

Answer 5

हमारे बड़े जावास्क्रिप्ट अनुप्रयोगों में, हम छोटे अलग फ़ाइलों में हमारे सभी कोड लिखने - एक फ़ाइल प्रति 'वर्ग' या कार्यात्मक समूह, एक तरह की जावा नेमस्पेसिंग/निर्देशिका संरचना का उपयोग कर। हम तो है:

• एक संकलन समय कदम है कि डाउनलोड आकार
• एक संकलन समय कदम है कि कक्षाओं कि हमेशा या कर रहे हैं लेता है कम करने के लिए हमारे सभी कोड और यह minifies (JSMin का एक संस्करण का उपयोग करके) लेता है सर्वर को
• ए 'क्लासलोडर' मांगने के लिए रनटाइम पर शेष कक्षाओं को लोड करने के लिए लगभग हमेशा आवश्यक और उन्हें एक बड़े बंडल में जोड़ता है।

Answer 6

अन्य (अच्छे) जावास्क्रिप्ट ऐप्स का कोड पढ़ें और देखें कि वे चीजों को कैसे संभालते हैं। लेकिन मैं प्रति वर्ग एक फ़ाइल के साथ शुरू करते हैं। लेकिन उत्पादन के लिए तैयार होने के बाद, मैं फ़ाइलों को एक बड़ी फाइल में जोड़ दूंगा और छोटा कर दूंगा।

एकमात्र कारण, मैं फ़ाइलों को गठबंधन नहीं करता, अगर मुझे सभी पृष्ठों पर सभी फ़ाइलों की आवश्यकता नहीं है।

Answer 7

इसके अलावा, मैं आपको बाहरी पुस्तकालयों को लोड करने के लिए Google के AJAX Libraries API का उपयोग करने का सुझाव देता हूं।

यह एक Google डेवलपर टूल है जो प्रमुख जावास्क्रिप्ट पुस्तकालयों को बंडल करता है और इसे संकुचित संस्करणों का उपयोग करके हमेशा तैनात, अपग्रेड और हल्का बना देता है।

इसके अलावा, यह आपकी परियोजना को सरल और हल्का बनाता है क्योंकि आपको अपनी परियोजना में पुस्तकालयों की फाइलों को डाउनलोड, कॉपी और बनाए रखने की आवश्यकता नहीं है।

google.load("jquery", "1.2.3"); 
google.load("jqueryui", "1.5.2"); 
google.load("prototype", "1.6"); 
google.load("scriptaculous", "1.8.1"); 
google.load("mootools", "1.11"); 
google.load("dojo", "1.1.1"); 

Answer 8

मेरे रणनीति 2 प्रमुख तकनीकों से मिलकर बनता है:

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

एएमडी मॉड्यूल: बहुत सीधे आगे, यहाँ देखें: http://requirejs.org/docs/optimization.html

मॉड्यूल पैटर्न:: http://requirejs.org/docs/api.html भी यह एक न्यूनतम किया गया जे एस फ़ाइल में अपने एप्लिकेशन के सभी भागों पैकेज करने में सक्षम है मैं इस लाइब्रेरी का प्रयोग किया: +०१२३२३९५२९अब आप पूछ रहे हैं यह क्या है? अधिक infos यहां: http://www.youtube.com/watch?v=7BGvy-S-Iag