आपने शायद प्रोग्रेसिव वेब ऐप्लिकेशन (पीडब्ल्यूए) की तकनीकों के बारे में सुना होगा. ये आपकी साइट के लिए बहुत फ़ायदेमंद हो सकती हैं. ऐसा हो सकता है कि आप अपनी साइट की परफ़ॉर्मेंस को बेहतर बनाए बिना, PWA की सुविधाएं जोड़ना चाहें. हालांकि, PWA की कोई भी सुविधा, JavaScript को ब्लॉक करने और बड़ी इमेज से जुड़ी समस्याओं को ठीक नहीं कर सकती.
इसके बजाय, आपका पहला कदम साइट ऑडिट करना है. इसमें यह देखा जाता है कि आपकी साइट पर कौनसी चीज़ें अच्छी तरह से काम कर रही हैं और किन चीज़ों को बेहतर बनाया जा सकता है.
अपनी साइट या ऐप्लिकेशन की ऑडिट करने से, आपको बेहतर परफ़ॉर्मेंस वाला अनुभव देने में मदद मिलती है. साथ ही, उन छोटी-छोटी उपलब्धियों को हाइलाइट करें जिन्हें कम से कम मंज़ूरी के साथ लागू किया जा सकता है. ऑडिट से, डेटा के आधार पर डेवलपमेंट के लिए एक बेसलाइन तैयार होती है. क्या बदलाव करने से चीज़ें बेहतर हुईं? आपकी साइट की तुलना प्रतिस्पर्धियों की साइट से कैसे की जाती है? आपको मेट्रिक मिलती हैं, ताकि आप यह तय कर सकें कि किस काम को प्राथमिकता देनी है. साथ ही, आपको यह पक्का सबूत मिलता है कि आपने परफ़ॉर्मेंस में सुधार किया है.
सिर्फ़ 5 मिनट में
अपने होम पेज पर Lighthouse चलाएं और रिपोर्ट का डेटा सेव करें. आपको परफ़ॉर्मेंस, सुलभता, सुरक्षा, और एसईओ को बेहतर बनाने के लिए, एक तय की गई बेसलाइन और काम की सूची मिलती है.
सिर्फ़ 30 मिनट में
शुरुआत करने के लिए, Lighthouse अब भी सबसे अच्छा टूल है. हालांकि, ज़्यादा समय होने पर, अन्य टूल से भी नतीजे रिकॉर्ड किए जा सकते हैं:
- Chrome DevTools का सुरक्षा पैनल: एचटीटीपीएस का इस्तेमाल.
- Chrome DevTools की नेटवर्क अनुरोधों वाली पैनल: लोड होने में लगने वाला समय; एचटीएमएल, सीएसएस, JavaScript, इमेज, फ़ॉन्ट, और अन्य फ़ाइलों के लिए, रिसॉर्स के साइज़ और अनुरोधों की संख्या.
- Chrome Task Manager: अगर आपकी साइट, अन्य ऐप्लिकेशन की तुलना में ज़्यादा सीपीयू या मेमोरी का इस्तेमाल करती है, तो आपको मेमोरी लीक, टास्क रनिंग या संसाधन लोड करने से जुड़ी समस्याओं को ठीक करना पड़ सकता है.
- WebPagetest: कैश मेमोरी, टाइम टू फ़र्स्ट बाइट, सीडीएन का इस्तेमाल.
- Pagespeed Insights: लोड होने की परफ़ॉर्मेंस, डेटा की लागत, और संसाधन के इस्तेमाल से जुड़ी जानकारी. इसमें Chrome उपयोगकर्ता अनुभव रिपोर्ट का डेटा भी शामिल है, जिसमें असल दुनिया में परफ़ॉर्मेंस के आंकड़े हाइलाइट किए जाते हैं.
अपनी वेबसाइट को उस तरह से टेस्ट करें जिस तरह से पहली बार आने वाला उपयोगकर्ता उसे देखता है. साइट को गुप्त (निजी) विंडो में खोलें या ब्राउज़र टूल का इस्तेमाल करके, कैश मेमोरी को बंद करें और स्टोरेज को मिटाएं. इससे यह पक्का होता है कि हर ऐसेट को नेटवर्क से वापस पाया गया है, न कि लोकल कैश मेमोरी से. इसलिए, आपको पहली बार लोड होने की परफ़ॉर्मेंस की सटीक जानकारी मिलती है.
असल दुनिया में किए गए टेस्ट से बेहतर कुछ नहीं होता. अपनी साइट को उन डिवाइसों और कनेक्टिविटी पर टेस्ट करें जो आपके उपयोगकर्ताओं के लिए उपलब्ध हैं. साथ ही, अपने अनुभव का रिकॉर्ड रखें.
अगर आपको टूल के बारे में जानकारी नहीं है
हमारी गाइड देखें: स्पीड टूल के बारे में कैसे सोचें.
अगर कोई भी तरीका काम नहीं करता है, तो Lighthouse का इस्तेमाल करके इन चीज़ों की जांच करें:
- एचटीटीपीएस: हर साइट को सभी ऐसेट, एचटीटीपीएस पर डिलीवर करनी चाहिए.
- सर्वर की सेटिंग: आपके वेब सर्वर या सीडीएन को कॉन्टेंट को सही तरीके से कंप्रेस करना चाहिए, HTTP/2 का इस्तेमाल करना चाहिए, और सही हेडर शामिल करने चाहिए, ताकि आपका ब्राउज़र संसाधनों को कैश मेमोरी में सेव कर सके.
- ऐसे स्क्रिप्ट एलिमेंट जिन्हें पेज के सबसे नीचे ले जाया जा सकता है या जिन्हें async या defer एट्रिब्यूट दिया जा सकता है.
- JavaScript और लाइब्रेरी, जिन्हें हटाया जा सकता है.
- इस्तेमाल नहीं किया गया कोड, जैसे कि सीएसएस और JavaScript लाइब्रेरी.
- इमेज के पिक्सल साइज़ को कम करने के अवसर.
- फ़ाइल फ़ॉर्मैट में ऐसे बदलाव करना जिनसे इमेज का साइज़ कम हो जाए. जैसे, PNG को JPG में बदलना.
ऑडियंस, स्टेकहोल्डर, कॉन्टेक्स्ट
रीफ़ैक्टरिंग के लिए प्राथमिकताएं, आपकी ऑडियंस, कॉन्टेंट, और फ़ंक्शन के हिसाब से तय की जाती हैं. आपकी साइट पर कौन आता है? वे इसका इस्तेमाल क्यों और कैसे करते हैं? आपका परफ़ॉर्मेंस बजट क्या है?
आपके स्टेकहोल्डर कौन हैं और उनकी प्राथमिकताएं क्या हैं? इससे आपके ऑडिट डेटा को स्ट्रक्चर करने, दिखाने, और शेयर करने के तरीके पर असर पड़ता है.
अगर पूरी साइट की जांच नहीं की जा सकती, तो पेज के आंकड़ों की जांच करें. इससे आपको यह पता चलेगा कि आपको कहां ध्यान देना है. ज़्यादा बाउंस रेट, पेज पर कम समय बिताना, और अचानक बंद होने वाले पेज, यह पता लगाने में मदद कर सकते हैं कि समस्या कहां है. इसी तरह, कारोबार की मेट्रिक, जैसे कि होस्टिंग का खर्च, विज्ञापन पर क्लिक, और कन्वर्ज़न. हितधारकों से जानें कि उनके लिए कौन-सा डेटा अहम है.
टेस्ट करें, रिकॉर्ड करें, ठीक करें, और इसी तरह आगे बढ़ते रहें
कोई भी बदलाव करने से पहले अपनी साइट की स्थिति रिकॉर्ड करें. इससे समस्याओं का पता लगाने और सुधार या गिरावट के लिए शुरुआती बिंदु सेट करने में मदद मिलती है. जिससे आपको डेवलपमेंट के काम को सही ठहराने और उसे बेहतर बनाने के लिए डेटा मिलता है.
अपनी साइट पर अलग-अलग तरह के पेजों की जांच करें. सिंगल पेज ऐप्लिकेशन के लिए, सिर्फ़ पहली बार लोड होने के अनुभव के बजाय, कॉम्पोनेंट, रास्तों, और यूज़र एक्सपीरियंस फ़्लो की जांच करें.