Google की पेजस्पीड संरचना, जिसका हम वर्षों से आदी हैं, यह सुनिश्चित करने के लिए बनाई गई है कि वेबसाइटें जल्दी लोड हों और सेवा दें। मापने योग्य पैरामीटर तैयार करके और क्रोम के मार्केट शेयर से एकत्र किए गए अनाम डेटा का लाभ उठाकर, Google इन मीट्रिक्स को SEO संकेतक के रूप में उपयोग करता है। 2022 में इंटरेक्शन टू नेक्स्ट पेंट (INP) की शुरुआत के साथ, फ़ोकस केवल पेज लोड स्पीड से हटकर व्यापक वेब प्रदर्शन परिप्रेक्ष्य में स्थानांतरित हो गया है। INP न केवल यह मापता है कि कोई पेज कितनी जल्दी लोड होता है, बल्कि यह भी मापता है कि पेज पर उपयोगकर्ता इंटरैक्शन कितनी तेज़ी से संसाधित होते हैं। अनिवार्य रूप से, यह साइट नेविगेशन अनुभव को पेजस्पीड मीट्रिक में बदल देता है।
केरेम के ब्लॉग पर, इस अवधारणा के लिए "सामान्य इंटरैक्शन विलंब" शब्द को उपयुक्त माना जाता है, जिसे Google ने अपने वीडियो में भी अच्छी तरह से समझाया है। हालाँकि, इस मीट्रिक को पूरी तरह से समझने के लिए, हम निम्नलिखित अनुभागों में इस विषय पर गहराई से चर्चा करेंगे।
आईएनपी अवधि का स्पष्टीकरण क्या है?
आईएनपी की अवधि में निम्नलिखित शामिल हैं:
- पृष्ठ के साथ उपयोगकर्ता की अंतःक्रिया और ईवेंट हैंडलर के निष्पादन के बीच का समय.
- स्क्रिप्ट का निष्पादन समय.
- कोड के निष्पादन से लेकर उपयोगकर्ता को आउटपुट प्रदर्शित होने तक का समय।
ये प्रक्रियाएँ आम तौर पर मिलीसेकंड के भीतर होती हैं, लेकिन मोबाइल डिवाइस पर, विशेष रूप से कम CPU पावर वाले पुराने Android फ़ोन पर, ऐसी देरी (विलंबता) अक्सर ध्यान देने योग्य हो सकती है। यह ध्यान देने योग्य है कि INP डेटा, अन्य लाइटहाउस डेटा की तरह, गुमनाम रूप से एकत्र किया जाता है और इसके आधार पर मूल्यांकन किया जाता है 75th प्रतिशतइसलिए, लक्ष्य ऐसे अनुप्रयोग बनाना है जो केवल उच्च-स्तरीय उपकरणों के बजाय औसत उपकरणों पर भी अच्छा प्रदर्शन करें।
आईएनपी अवधि के वास्तविक जीवन के उदाहरण
इस अवधारणा को समझाने के लिए हम जिन इंटरनेट पृष्ठों पर प्रतिदिन जाते हैं, उनमें से कुछ वास्तविक जीवन के उदाहरण यहां दिए गए हैं:
ई-कॉमर्स साइट पर पता दर्ज करना
जब आप किसी ई-कॉमर्स साइट पर खरीदारी कर रहे होते हैं और शिपमेंट के लिए पता दर्ज करते हैं, तो आप सबसे पहले प्रांत का चयन करते हैं। फिर, जब आप जिला चुनने के लिए चयन बॉक्स पर क्लिक करते हैं, तो आप Ajax परिणाम लोड होने के लिए कुछ समय तक प्रतीक्षा करते हैं, और एक निश्चित समय के बाद, जिले की जानकारी लोड हो जाती है। यह INP का एक अच्छा उदाहरण है। इस उदाहरण में उपयोगकर्ता अनुभव को बेहतर बनाने के लिए Ajax प्रक्रिया के बारे में उपयोगकर्ता को सूचित करने के लिए "लोडिंग इंडिकेटर" जोड़ना शामिल हो सकता है।
चयन छंटाई
उत्पाद लिस्टिंग पृष्ठों पर फ़िल्टर का उपयोग करते समय, यदि फ़िल्टर किए गए उत्पादों को चेकबॉक्स पर क्लिक करने के बाद ठीक से प्रबंधित नहीं किया जाता है, तो यह INP को बढ़ा देगा। कम जटिल JS का उपयोग करना और फ़िल्टर संचालन के दौरान उपयोगकर्ता अनुभव पर विचार करना INP मान को यथासंभव उच्च रखने में मदद कर सकता है।
उत्पाद फोटो गैलरी
उत्पाद विवरण पृष्ठ पर उत्पाद फोटो पर क्लिक करने के बाद फोटो गैलरी लोड होने के लिए उपयोगकर्ताओं द्वारा प्रतीक्षा किया जाने वाला समय संभावित रूप से INP को प्रभावित कर सकता है।
आरक्षण बटन
"आरक्षण करें" बटन पर क्लिक करने और अगले पृष्ठ पर पहुंचने के बीच होने वाला इंटरेक्शन विलंब INP का एक उदाहरण है।
कार्ट में जोड़ें बटन
"कार्ट में जोड़ें" बटन पर क्लिक करने और यह सोचने में लगने वाला मिलीसेकंड का विलंब कि आइटम कार्ट में जोड़ा गया है या नहीं, INP को पूर्णतः परिभाषित करता है।
जैसा कि इन उदाहरणों में देखा गया है, INP ट्रैप ऐसे परिदृश्यों में मौजूद हैं जो SEO और प्रत्यक्ष रूपांतरण दर दोनों को प्रभावित करते हैं।
आईएनपी में सुधार कैसे करें?
- अद्यतन JS फ्रंटएंड लाइब्रेरी का उपयोग करें: Vue, React और Angular जैसी आधुनिक JS फ्रंटएंड लाइब्रेरीज़ का उपयोग करके प्रदर्शन में सुधार करना फायदेमंद है क्योंकि वे प्रदर्शन और पुन: प्रयोज्यता लाभ प्रदान करते हैं।
- JS लाइब्रेरीज़ की जटिलता को न्यूनतम करें: कम जटिल JS लाइब्रेरी का उपयोग करना उचित है। व्यक्तिगत रूप से, मैं जितना संभव हो jQuery से बचने की सलाह देता हूं।
स्वीकार्य INP मीट्रिक स्तर
के लिए सीमा मान अच्छे, मध्यम और खराब INP स्तर 200 मिलीसेकंड और 500 मिलीसेकंड हैंअच्छे उपयोगकर्ता अनुभव और समग्र वेब प्रदर्शन को बनाए रखने के लिए INP को इन सीमाओं के भीतर रखना महत्वपूर्ण है।
