2012-07-17 7 views
26

एक बड़ी वेबसाइट पर वास्तव में जेएस की कितनी तेज़ी से आवश्यकता है?जेएस में RequJS/AMD के साथ कितनी गति प्राप्त की जाती है?

क्या किसी ने बड़ी वेबसाइटों की गति पर कोई परीक्षण किया है जो असीमित लोडिंग बनाम नहीं हैं?

उदाहरण के लिए, कई विचारों (> 100) के साथ बैकबोन का उपयोग करना, क्या यह एक विचार वस्तु है जो सभी विचारों के साथ एक बार में लोड हो जाता है और फिर हमेशा उपलब्ध होता है, या वे सभी को असीमित रूप से लोड किया जाना चाहिए जैसी जरूरत थी?

इसके अलावा, क्या मोबाइल बनाम डेस्कटॉप के लिए इन विचारों के लिए कोई अंतर है? मैंने सुना है कि आप आकार के बजाय मोबाइल पर अनुरोधों के संख्या को सीमित करना चाहते हैं।

उत्तर

68

मैं नहीं मानता कि require.js के इरादे उत्पादन में एसिंक्रोनस रूप अपनी स्क्रिप्ट के सभी लोड करने के लिए है। विकास प्रत्येक स्क्रिप्ट की एसिंक लोडिंग सुविधाजनक है क्योंकि आप अपने प्रोजेक्ट में बदलाव कर सकते हैं और "संकलन" चरण के बिना पुनः लोड कर सकते हैं। हालांकि उत्पादन में r.js optimizer का उपयोग कर एक या अधिक बड़े मॉड्यूल में होना चाहिए। यदि आपका बड़ा वेबपैप बाद में आपके मॉड्यूल के सबसेट की लोडिंग को रोक सकता है (उदाहरण के लिए किसी विशेष उपयोगकर्ता कार्रवाई के बाद) ये मॉड्यूल अलग-अलग अनुकूलित हो सकते हैं और उत्पादन में असीमित रूप से लोड हो सकते हैं।

एक बड़ी जे एस फ़ाइल एकाधिक छोटी फ़ाइलों बनाम लोड हो रहा है, आम तौर पर की गति के बारे में:

"HTTP अनुरोध कम करें" दृश्यपटल प्रदर्शन को तेज करने के लिए एक सामान्य कहावत बन गया है, और कहा कि एक चिंता का विषय भी है कि है मोबाइल ब्राउज़र के आज की दुनिया में अधिक प्रासंगिक (अक्सर नेटवर्क पर चल रहा है जो ब्रॉडबैंड कनेक्शन की तुलना में धीमी गति का क्रम है)। [reference]

लेकिन वहाँ इस तरह के रूप अन्य कारणों हैं:

  • मोबाइल कैश: iPhones limit the size of files they cache इतना बड़ा फ़ाइलें हर बार डाउनलोड किया जा करने के लिए, कई छोटे फ़ाइलों को बेहतर बनाने की आवश्यकता हो सकती।
  • CDN प्रयोग: आप jQueryकी तरह एक आम 3 पार्टी पुस्तकालय का उपयोग करते हैं यह एक बड़ा एकल जे एस फ़ाइल में शामिल करने और इसके बजाय आपकी साइट के एक उपयोगकर्ता के बाद से एक CDN से यह लोड नहीं शायद सबसे अच्छा है पहले से ही यह हो सकता है किसी अन्य वेबसाइट से अपने कैश में (reference)। अधिक जानकारी के लिए नीचे दिए गए
  • आलसी मूल्यांकन अद्यतन देखें: एएमडी मॉड्यूल lazily पार्स किया जा सकता और जब तक पार्स + eval की लागत टाल जब तक मॉड्यूल की जरूरत है एप्लिकेशन लोड पर डाउनलोड की अनुमति का मूल्यांकन किया। this आलेख और अन्य पुराने लेखों की श्रृंखला देखें जो संदर्भित करती हैं।
  • लक्ष्य ब्राउज़र: ब्राउज़र प्रति होस्टनाम समवर्ती डाउनलोड की संख्या सीमित करते हैं। उदाहरण के लिए, आईई 7 केवल एक मेजबान मेजबान से दो फाइलें डाउनलोड करेगा। दूसरों के लिए 6. [reference]

अंत में, here's a good article by Steve Souders कि तकनीक स्क्रिप्ट लोड हो रहा है के एक समूह को सारांशित दूसरों से 4 की सीमा है, और।

अद्यतन: पुन CDN उपयोग: स्टीव Souders 3 पार्टी पुस्तकालयों (जैसे jQuery) के लिए एक CDN का उपयोग करने का posted a detailed analysis है कि कई कारणों से, पक्ष-विपक्ष को पहचानती है।

+1

बहुत बढ़िया उत्तर, धन्यवाद! –

+0

हॉट रीलोड RequJS के साथ बनाना आसान है क्योंकि इसे विकास –

10

यह प्रश्न अब थोड़ा पुराना है, लेकिन मैंने सोचा कि मैं अपने विचार जोड़ सकता हूं।

मैं उत्पादन के लिए अपने सभी कोड को गठबंधन करने के लिए r.js का उपयोग करने में rharper से पूरी तरह से सहमत हूं, लेकिन विभाजन कार्यक्षमता के मामले में भी एक मामला है।

एकल पृष्ठ ऐप्स के लिए मुझे लगता है कि सबकुछ एक साथ होने से समझ में आता है। बड़े पैमाने पर अधिक पारंपरिक पृष्ठ आधारित वेबसाइटों के लिए जो पेज इंटरैक्शन में हैं, यह काफी बोझिल हो सकता है और परिणामस्वरूप बहुत सारे उपयोगकर्ताओं के लिए बहुत अनावश्यक कोड लोड हो रहा है।

दृष्टिकोण मैं कई बार इस्तेमाल किया है (सभी पृष्ठों पर जरूरत उन्हें ठीक से संचालित करने के लिए)

  • कोर मॉड्यूल को परिभाषित है, यह एक एकल फाइल में संयुक्त हो जाता है।
  • मॉड्यूल लोडर बनाएं जो मॉड्यूल लोडर और मॉड्यूल के लिए पथ
  • मॉड्यूल लोडर और एसिंक लोड मॉड्यूल के माध्यम से विशिष्ट पृष्ठों द्वारा आवश्यक कार्यक्षमता के लिए आवश्यक कार्यक्षमता के लिए आवश्यक है।

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

+1

वाह में अलग मॉड्यूल की असीमित लोडिंग माना जाता है। यह मेरे लिए बहुत दिलचस्प लगता है। क्या आप उन परियोजनाओं पर इंगित कर सकते हैं जिनमें इस दृष्टिकोण का उपयोग किया जा रहा है? मैं अपने पेशेवरों/विपक्ष के बारे में अधिक जानना चाहता हूं। – FRD

संबंधित मुद्दे