पर jQuery मोबाइल बहुत धीमी है, मैं क्लाइंट साइड पर jQuery मोबाइल का उपयोग कर वेब एप्लिकेशन विकसित कर रहा हूं और PHP & सर्वर साइड पर MySQL। एप्लिकेशन सफारी, क्रोम और फ़ायरफ़ॉक्स जैसे डेस्कटॉप ब्राउज़र पर बहुत अच्छा काम करता है। हालांकि, आईपैड पर - जहां होम स्क्रीन से वेब क्लिप के रूप में एप्लिकेशन खोला जाता है - एप्लिकेशन बहुत खराब प्रदर्शन करता है। स्क्रॉलिंग ठीक काम करता है, लेकिन सर्वर से पेज लोड करने के लिए एक लिंक टैप करना बहुत धीमा हो जाता है।आईपैड
आईपैड की स्क्रीन की एक रिकॉर्डिंग से पता चलता है कि (उदाहरण के लिए) टैप करने के बाद टैप किए गए तत्व को हाइलाइट करने से पहले 0,3 सेकेंड लगते हैं और लोडर दिखाया जाता है। शुरुआत से 1,0 सेकंड के बाद खोले गए पृष्ठ के निचले हिस्से को प्रस्तुत/दिखाया गया है (लोडर के नीचे)। पृष्ठ के ऊपरी हिस्से को दिखाए जाने से पहले यह 0,6 सेकेंड लेता है, जिससे पेज 1,6 सेकेंड लोड करने के लिए कुल समय आवश्यक होता है। इस प्रक्रिया को दिखाते हुए एक वीडियो (मूल गति के 25% पर खेला गया) here पाया जा सकता है।
मैं समझता हूँ कि एक पृष्ठ (वाईफ़ाई से अधिक) लोड हो रहा है कुछ समय लगता है, लेकिन मुझे समझ नहीं आता क्यों पृष्ठ के ऊपरी हिस्से प्रतिपादन एक अतिरिक्त 0,6 सेकंड लेता है। यह मानते हुए कि पृष्ठ 1,0 सेकंड के बाद पूरी तरह से लोड हो गया है (क्योंकि पृष्ठ का निचला आधा पहले से दिखाया गया है), मुझे लगता है कि इसमें काफी समय लगता है, क्योंकि यह मेरे मैक पर सफारी पर केवल 0,5 सेकेंड लगते हैं । लेकिन यह मेरे आईपैड में धीमे प्रोसेसर और वाईफाई कनेक्शन के अंतराल के कारण हो सकता है।
उम्मीद है कि कोई एप्लिकेशन कुछ (क्लाइंट साइड) ऑप्टिमाइज़ेशन को एप्लिकेशन को (या महसूस) तेज करने के लिए जानता है। मैंने पहले से ही jQuery मोबाइल के भीतर एनिमेशन अक्षम कर दिए हैं और मैं सर्वर पक्ष को अनुकूलित करने का प्रयास करूंगा।
हो सकता है कि इन बातों को पता करने के लिए महत्वपूर्ण हैं:
- सभी पृष्ठों मैं सर्वर से लौटने के कई संदर्भित स्टाइलशीट और स्क्रिप्ट के साथ एक पूर्ण
<head>है। क्या jQuery मोबाइल<head>या आहार को प्रसंस्करण शक्ति लेता है? - मेरे पास अधिकांश पृष्ठों पर एक निश्चित शीर्षलेख और पाद लेख है। मैं इसे पूरा करने के लिए
<div data-role="…" data-position="fixed" data-id="…" data-tap-toggle="false">का उपयोग कर रहा हूं। हेडर और पाद लेख सभी पृष्ठों में भी शामिल हैं। - अधिकांश शीर्षकों के बाईं ओर एक बटन होता है (
<a data-role="button">टैग), मध्य में एक शीर्षक (<h1>टैग) और दाईं ओर एक नियंत्रण समूह (<div data-role="controlgroup">) जिसमें दो बटन (<a data-role="button">) होते हैं। - शीर्षलेख में एक बटन पृष्ठ को प्रीफ़ेच करने के लिए सेट किया गया है जहां यह लिंक करता है (
<a href="…" data-role="button" data-rel="dialog" data-prefetch>)। यह बटन प्रत्येक पृष्ठ में शामिल है, लेकिन लिंक केhrefप्रत्येक पृष्ठ पर समान है। यह कुछ हो सकता है ..? - सभी पैरों में कई आइटम (
<li><a>) के साथ एक navbar (<div data-role="navbar">) है। - कुछ पृष्ठ फ़िल्टर क्षमताओं के साथ सूचीदृश्य हैं (
<ul data-role="listview" data-filter="true">)। वर्तमान में इसमें केवल कुछ आइटम हैं (<li><a>, अधिकतम 5) और सूची डिवाइडर (<li data-role="list-divider">)। - अन्य पृष्ठ फॉर्म (
<form>) हैं जिनमें सूचीदृश्य भी शामिल हैं (<ul data-role="listview" data-inset="true">) कई फॉर्म फ़ील्ड्स (<li data-role="fieldcontain">) के साथ।
ठीक है, ये सभी 'विशेष' चीजें हैं जिनके बारे में मैं सोच सकता हूं। यदि आपको अधिक जानने या कुछ स्रोत कोड देखने की आवश्यकता है, तो कृपया मुझे बताएं।
मैंने एक घर में वेब ऐप विकास ढांचे को विकसित करने के लिए jQuery मोबाइल का उपयोग किया। मुझे यह कहते हुए खुशी हो रही है कि प्रदर्शन दोनों ढांचे और परिणामी वेब ऐप्स में चिह्न तक काफी था। इससे मुझे लगता है कि, आपके पृष्ठों में कुछ ऐसा हो सकता है जो बहुत सारी प्रसंस्करण का उपभोग कर सकता है? क्या आप देख सकते हैं, स्पॉट आउट और ऐसे हिस्सों को पोस्ट कर सकते हैं ताकि एसओ बेहतर दिख सके? – kishu27
@ kishu27 मैंने अपने आवेदन का वर्णन करने वाले कुछ तकनीकी विवरण जोड़े हैं। – Jonathan
यदि मैं आपकी स्थिति में था, तो मैं पेज के हिस्सों को प्रस्तुत करना शुरू कर दूंगा (टिप्पणी कर रहा हूं), और देखें कि प्रदर्शन को क्या प्रभावित करता है। जिन चीजों का आपने उल्लेख किया है वे हैं जो मैंने किया है, # 1 को छोड़कर। और वे प्रदर्शन को प्रभावित नहीं करते हैं। – kishu27