एक jQuery मोबाइल एप्लिकेशन व्यवस्थित करने का सबसे अच्छा अभ्यास क्या है?

Question

मुझे article मिल गया है जो इस पर skims। लेकिन मेरा मुख्य सवाल यह है कि मुझे प्रत्येक स्क्रीन के लिए एक अलग .html फ़ाइल की आवश्यकता है? मैं हां सोच रहा हूं लेकिन मुझे सर्वसम्मति से वोट चाहिए। साथ ही, क्या यह अलग जेएस फाइलों के लिए भी जाता है?

संपादित करें: जेक्यूएम ऐप मूल रूप से व्यवस्थापक उपयोगकर्ताओं और भूमिकाओं के लिए है।

Answer 1

हमारे पास एक उत्पादन जेक्यूएम साइट है, हम यहां चीजें कैसे करते हैं - और हां अन्य असहमत हो सकते हैं लेकिन हमें यह एक बहुत बड़ी साइट के लिए काम करता है।

1. उपयोग एकाधिक एकल HTML पृष्ठों, एक बड़े बहु-पृष्ठ टेम्पलेट jQM के ajax लोड हो रहा है के लाभों को हरा दिया जब से तुम शुरू में अपने सभी एचटीएमएल लोड कर रहे हैं (जब तक कि आपकी साइट छोटा है)

2. आप निश्चित रूप से AJAX लोडिंग का उपयोग करना चाहते हैं, जेक्यूएम केवल आपके <div data-role="page"> में कोड खींचता है लेकिन यह आपके जेएस को नीचे

3. आपको एकाधिक जेएस फ़ाइलों की आवश्यकता नहीं है, लेकिन आपको शुरुआत में अपने सभी जेएस लोड करने की आवश्यकता है, हम इसे दो चीजें करके पूरा करते हैं: 1. हम दस्तावेज़ रूट पर on श्रोता डालते हैं, और पेजिनिट/पेजशो ईवेंट के लिए सुनते हैं। जब भी कोई पृष्ठ लोड होता है तो इन्हें ट्रिगर किया जाता है, आपके पास वर्तमान पृष्ठ का आसान संदर्भ भी होता है, और आप यह निर्धारित करने के लिए पृष्ठ पर एक एटीआर का उपयोग कर सकते हैं कि यह कौन सा पृष्ठ था। 2. सभी जेएस को किसी प्रकार के शामिल करने के लिए है (उम्मीद है कि आप PHP, सीएफ या कुछ का उपयोग कर रहे हैं) और इसे हर पृष्ठ पर रखें, इस तरह कोई फर्क नहीं पड़ता कि कोई उपयोगकर्ता उस बिंदु को इंगित करता है जो उपयोगकर्ता आपकी मोबाइल साइट पर ब्राउज़ करता है, उन्हें मिलता है सभी कोड लोड

नकारात्मक पक्ष यह है कि सभी जे एस शुरू में भरी हुई है, लेकिन न्यूनतम किया गया तो हम पाते हैं यह कोई बड़ी बात नहीं है, और यदि यह वास्तव में एक चिंता का विषय है RequireJS पर गौर है - साथ ही इसकी जे एस के बाद से एक हवा डिबगिंग बनाता है क्या हम वहां आसानी से डीबगर और जगह ब्रेकपॉइंट्स का उपयोग कर सकते हैं। यदि आप प्रत्येक पृष्ठ पर जेएस को गतिशील रूप से लोड करते हैं तो आप प्रत्येक पृष्ठ ट्रांजिस्टियन पर वापस लौटने के लिए आवश्यक डेटा बढ़ाते हैं और आपको कुरूपता होती है क्योंकि आप अनावश्यक जेएस को पुनः लोड करते हैं और गतिशील जेएस डीबग करना मुश्किल है।

$(document).on('pageinit pageshow', 'div:jqmData(role="page"), div:jqmData(role="dialog")', function(oEvent){ 

    var pageType = $(this).data('pagetype'); 

    //handle pageinit/pageshow (oEvent.type) for each pageType 

Answer 2

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

Answer 3

यह एक बहुत ही व्यक्तिपरक विषय है लेकिन यह भी एक बड़ी प्रवृत्ति बन रहा है। कुछ single page web sites (मोबाइल ऐप्स) पसंद करते हैं। विकी आलेख यहां एक बड़ी नौकरी की समस्या पर चर्चा करता है जो एकल पृष्ठ ऐप्स हल करता है।

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

हालांकि यह आपके प्रोजेक्ट के आकार पर काफी हद तक निर्भर हो सकता है। JQuery मोबाइल दस्तावेज़ large DOMs here के कुछ प्रदर्शन समस्याओं पर छूता है।

Answer 4

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

href="tel:+1[your telephone number here (numbers only)]" 
href="[standard link to google maps here]" 
href=mailto:[your email address] 

jQuery सत्यापन का उपयोग करके मान्य करें ThemeRoller का उपयोग करें। चुनिंदा मेनू के बजाय रेडियो बटन समूह का प्रयोग करें। Google Analytics जोड़ें निर्धारित करें कि कौन सी नेविगेशन शैली का उपयोग करना है। कोड के साथ शुरू मत करो।