इंटरैक्शन टू नेक्स्ट पेंट (आईएनपी)

ब्राउज़र सहायता

  • 96
  • 96
  • x
  • x

सोर्स

इंटरैक्शन टू नेक्स्ट पेंट (आईएनपी) एक स्टेबल कोर वेब वाइटल मेट्रिक है, जो Event Timing API के डेटा का इस्तेमाल करके पेज पर रिस्पॉन्स का आकलन करती है. INP किसी पेज के पूरे जीवनकाल में होने वाले सभी क्लिक, टैप, और कीबोर्ड इंटरैक्शन के इंतज़ार में लगने वाले समय को ट्रैक करता है. साथ ही, बाहरी कारकों को अनदेखा करते हुए, सबसे लंबी अवधि की रिपोर्ट करता है. आईएनपी कम होने का मतलब है कि पेज, उपयोगकर्ताओं के ज़्यादातर इंटरैक्शन का तुरंत जवाब दे पा रहा है.

बेहतर रिस्पॉन्स का मतलब है कि पेज, इंटरैक्शन का तुरंत जवाब देता है. जब कोई पेज किसी इंटरैक्शन का जवाब देता है, तो ब्राउज़र अपने रेंडर होने वाले अगले फ़्रेम में विज़ुअल फ़ीडबैक दिखाता है. इससे पता चलता है कि इंटरैक्शन सफल रहा. उदाहरण के लिए, इससे इन चीज़ों के बारे में सुझाव/राय दी जा सकती है या शिकायत की जा सकती है:

  • आपके ज़रिए किसी ऑनलाइन शॉपिंग कार्ट में जोड़ा गया आइटम असल में जोड़ा जा रहा है या नहीं.
  • मोबाइल नेविगेशन मेन्यू खोला गया है या नहीं.
  • लॉगिन के कॉन्टेंट की पुष्टि सर्वर से की जा रही है या नहीं.

कुछ इंटरैक्शन स्वाभाविक रूप से दूसरे की तुलना में ज़्यादा समय लेते हैं, लेकिन खास तौर पर मुश्किल इंटरैक्शन के लिए, कुछ शुरुआती विज़ुअल फ़ीडबैक देना ज़रूरी है. इससे उपयोगकर्ता को यह बताया जा सकता है कि क्या हो रहा है. यह काम करने का सबसे शुरुआती मौका होता है, अगली बार पेंट होने में लगने वाला समय. इसलिए, INP का मकसद इंटरैक्शन के आखिर में होने वाले सभी असर (जैसे कि नेटवर्क फ़ेच और अन्य एसिंक्रोनस ऑपरेशन के यूज़र इंटरफ़ेस (यूआई) अपडेट) को मापना है, बल्कि next पेंट के ब्लॉक होने के समय को मापना है. विज़ुअल फ़ीडबैक में देरी करने से, उपयोगकर्ताओं को लगता है कि पेज उनकी कार्रवाइयों के हिसाब से काम नहीं कर रहा है.

आईएनपी का लक्ष्य, उपयोगकर्ता के इंटरैक्शन की शुरुआत करने से लेकर, अगला फ़्रेम पेंट होने तक के उस समय को कम से कम करना होता है जो उपयोगकर्ता की ओर से शुरू किए गए सभी या ज़्यादातर इंटरैक्शन के लिए होता है.

ख़राब बनाम अच्छे जवाब देने का उदाहरण. बाईं ओर, लंबे टास्क की वजह से अकॉर्डियन नहीं खुलता. इस वजह से, उपयोगकर्ता कई बार यह सोचकर क्लिक करता है कि अब उसे इस्तेमाल करने में समस्या आ रही है. जब मुख्य थ्रेड इकट्ठा हो जाती है, तो यह देर से दिखने वाले इनपुट को प्रोसेस करती है. इसकी वजह से, अकॉर्डियन अचानक खुल जाता है और बंद हो जाता है. दाईं ओर, ज़्यादा रिस्पॉन्सिव पेज होगा. इससे अकॉर्डियन जल्दी और बिना किसी अपवाद के खुल जाता है.
आईएनपी का हिसाब कैसे लगाया जाता है, इस बारे में जानकारी

किसी पेज के साथ हुए सभी इंटरैक्शन को देखकर आईएनपी कैलकुलेट किया जाता है. ज़्यादातर साइटों के लिए, सबसे खराब इंतज़ार के समय के साथ इंटरैक्शन को आईएनपी के तौर पर रिपोर्ट किया जाता है. हालांकि, ज़्यादा इंटरैक्शन वाले पेजों के लिए, किसी भी क्रम में गड़बड़ी की वजह से, किसी साइट पर बिना किसी समस्या के, इंतज़ार का समय ज़्यादा बढ़ सकता है. जितने ज़्यादा इंटरैक्शन होंगे, उसके होने की संभावना उतनी ही ज़्यादा होगी. इससे बचने के लिए, हम हर 50 इंटरैक्शन के लिए सबसे ज़्यादा इंटरैक्शन को अनदेखा करते हैं. साथ ही, इस तरह के पेजों से जुड़े रिस्पॉन्स को बेहतर तरीके से मेज़र करने के लिए, हम हर 50 इंटरैक्शन के लिए ही सबसे ज़्यादा इंटरैक्शन को अनदेखा करते हैं. ज़्यादातर पेज एक्सपीरियंस में 50 से ज़्यादा इंटरैक्शन नहीं होते हैं. इसलिए, ब्राउज़र हमेशा सबसे खराब इंटरैक्शन की रिपोर्ट करता है. इसके बाद, सभी पेज व्यू का 75वां पर्सेंटाइल रिपोर्ट किया जाता है. यह सामान्य उपयोगकर्ता अनुभव को बेहतर तरीके से दिखाने के लिए, आउटलायर को हटा देता है.

इंटरैक्शन, इवेंट हैंडलर का एक ग्रुप है जो एक ही लॉजिकल उपयोगकर्ता जेस्चर के दौरान सक्रिय होता है. उदाहरण के लिए, टचस्क्रीन डिवाइस पर होने वाले "टैप" इंटरैक्शन में pointerup, pointerdown, और click जैसे कई इवेंट शामिल होते हैं. JavaScript, सीएसएस, पहले से मौजूद ब्राउज़र कंट्रोल, जैसे कि फ़ॉर्म एलिमेंट या इन सभी चीज़ों के मिले-जुले इस्तेमाल से इंटरैक्शन हो सकता है.

इंटरैक्शन के इंतज़ार के समय में इवेंट हैंडलर के ग्रुप की एक सबसे लंबी अवधि होती है, जो इंटरैक्शन को बढ़ाती है. इसमें उपयोगकर्ता के इंटरैक्शन की शुरुआत से लेकर अगले फ़्रेम के विज़ुअल फ़ीडबैक के समय तक की अवधि होती है.

अहम जानकारी: आईएनपी को मेज़र करने के तरीके के बारे में ज़्यादा जानने के लिए, "इंटरैक्शन में क्या है?" पेज देखें.

अच्छा आईएनपी स्कोर क्या होता है?

यह पक्का करने के लिए कि उपयोगकर्ता को बेहतर रिस्पॉन्स के साथ अनुभव मिल रहा हो, फ़ील्ड में रिकॉर्ड किए गए पेज लोड का 75वां पर्सेंटाइल होता है. इन्हें मोबाइल और डेस्कटॉप डिवाइसों के हिसाब से सेगमेंट में बांटा जाता है:

  • 200 मिलीसेकंड के बराबर या उससे कम आईएनपी का मतलब है कि आपके पेज को अच्छा रिस्पॉन्स है.
  • 200 मिलीसेकंड से 500 मिलीसेकंड के बीच के आईएनपी का मतलब है कि आपके पेज की रिस्पॉन्सिबिलिटी में सुधार की ज़रूरत है.
  • 500 मिलीसेकंड से ज़्यादा के आईएनपी का मतलब है कि आपके पेज पर जवाब खराब है.
आईएनपी की अच्छी वैल्यू 200 मिलीसेकंड या उससे कम होती हैं. खराब वैल्यू, 500 मिलीसेकंड से ज़्यादा होती हैं. साथ ही, इन वैल्यू में सुधार की ज़रूरत भी होती है.
आईएनपी की अच्छी वैल्यू 200 मि॰से॰ या उससे कम होती हैं. खराब वैल्यू 500 मि॰से॰ से ज़्यादा है.

इंटरैक्शन में क्या होता है?

मुख्य थ्रेड पर होने वाले इंटरैक्शन को दिखाने वाला डायग्राम. उपयोगकर्ता, टास्क को ब्लॉक करते समय कोई इनपुट देता है. टास्क पूरा होने तक, इनपुट में देरी होती है. इसके बाद पॉइंटरअप, माउसअप, और क्लिक इवेंट हैंडलर चलते हैं. इसके बाद, अगला फ़्रेम दिखाए जाने तक, रेंडरिंग और पेंटिंग का काम बंद हो जाता है.
इंटरैक्शन की अवधि. इनपुट में देरी तब तक रहती है, जब तक इवेंट हैंडलर चालू नहीं होते. ऐसा मुख्य थ्रेड पर लंबे टास्क जैसी वजहों से हो सकता है. इसके बाद, इंटरैक्शन के इवेंट हैंडलर चलते हैं और अगला फ़्रेम दिखाए जाने से पहले देरी होती है.

इंटरैक्टिविटी की मुख्य वजह अक्सर JavaScript होती है. हालांकि, ब्राउज़र ऐसे कंट्रोल के ज़रिए इंटरैक्टिविटी उपलब्ध कराते हैं जो JavaScript से नहीं लिए जाते. जैसे, चेकबॉक्स, रेडियो बटन, और सीएसएस का इस्तेमाल करने वाले कंट्रोल.

आईएनपी के लिए, सिर्फ़ ये इंटरैक्शन टाइप देखे जाते हैं:

  • माउस से क्लिक करना.
  • टचस्क्रीन वाले डिवाइस पर टैप करना.
  • किसी फ़िज़िकल या ऑनस्क्रीन कीबोर्ड पर कोई बटन दबाना.

अहम जानकारी: कर्सर घुमाने और स्क्रोल करने से आईएनपी मेट्रिक पर असर नहीं पड़ता. हालांकि, कीबोर्ड पर स्क्रोल करने (स्पेस बार, पेज अप, पेज डाउन वगैरह) में एक कीस्ट्रोक शामिल होता है. इससे ऐसे अन्य इवेंट ट्रिगर हो सकते हैं जिन्हें आईएनपी मेज़र करता है. इससे मिलने वाली किसी भी स्क्रोलिंग को आईएनपी कैलकुलेशन में शामिल नहीं किया जाता है.

इंटरैक्शन मुख्य दस्तावेज़ में या दस्तावेज़ में एम्बेड किए गए iframe में होते हैं—उदाहरण के लिए, एम्बेड किए गए वीडियो पर चलाएं पर क्लिक करना. असली उपयोगकर्ताओं को यह नहीं पता होता है कि पेज के कौनसे हिस्से iframe में हैं. इसलिए, आपको iframe में आईएनपी को मेज़र करना होगा, ताकि पूरे पेज के लिए उसे सही तरीके से मेज़र किया जा सके. हालांकि, JavaScript के वेब एपीआई के पास iframe के कॉन्टेंट का ऐक्सेस नहीं होता है और हो सकता है कि iframe में आईएनपी को मेज़र न किया जा सके. यह CrUX और RUM के बीच के अंतर के तौर पर दिखता है.

इंटरैक्शन में एक से ज़्यादा इवेंट हो सकते हैं. उदाहरण के लिए, कीस्ट्रोक में keydown, keypress, और keyup इवेंट शामिल होते हैं. वहीं, टैप इंटरैक्शन में pointerup और pointerdown इवेंट शामिल होते हैं. इंटरैक्शन के अंदर सबसे ज़्यादा अवधि वाले इवेंट को इंटरैक्शन की इंतज़ार के समय के तौर पर चुना जाता है.

दो इंटरैक्शन वाले ज़्यादा जटिल इंटरैक्शन को दिखाना. पहला, माउसडाउन इवेंट है, जो माउस बटन के आने से पहले एक फ़्रेम बनाता है. इसमें, ज़्यादा काम करना तब तक शुरू होता है, जब तक कि दूसरा फ़्रेम नहीं आ जाता.
जब उपयोगकर्ता क्लिक करने के लिए माउस बटन दबाता है, तो ब्राउज़र इंटरैक्शन को मैनेज करता है और विज़ुअल फ़ीडबैक का एक फ़्रेम दिखाता है. जब कोई उपयोगकर्ता माउस बटन रिलीज़ करता है, तो इवेंट हैंडलर की एक और सीरीज़ चलती है. इससे पहले कि ब्राउज़र दूसरा फ़्रेम प्रज़ेंट कर सके.

आईएनपी का हिसाब तब लगाया जाता है, जब उपयोगकर्ता पेज से चला जाता है. इससे पूरी लाइफ़साइकल के दौरान, पेज के रिस्पॉन्स को एक ही वैल्यू के तौर पर दिखाया जाता है. आईएनपी कम होने का मतलब है कि पेज, उपयोगकर्ता के इनपुट के हिसाब से सही तरीके से रिस्पॉन्सिव है.

आईएनपी और फ़र्स्ट इनपुट डिले (एफ़आईडी) में क्या अंतर है?

आईएनपी, फ़र्स्ट इनपुट डिले (एफ़आईडी) की अगली मेट्रिक है. दोनों, रिस्पॉन्सिबिलिटी मेट्रिक हैं. हालांकि, एफ़आईडी ने सिर्फ़ किसी पेज पर पहले इंटरैक्शन के इनपुट में देरी को मेज़र किया है. INP, एफ़आईडी को बेहतर बनाने के लिए, पेज के सभी इंटरैक्शन को ध्यान में रखता है. इसमें इनपुट में देरी से लेकर इवेंट हैंडलर को चलाने में लगने वाले समय से लेकर, ब्राउज़र के अगले फ़्रेम को पेंट करने तक के समय को ध्यान में रखा जाता है.

इन अंतर का मतलब है कि आईएनपी और एफ़आईडी, दोनों अलग-अलग तरह की प्रतिक्रिया देने वाली मेट्रिक हैं. एफ़आईडी, एक लोड रिस्पॉन्सिबिलिटी मेट्रिक था. इसे उपयोगकर्ता पर पेज के पहले इंप्रेशन का आकलन करने के लिए डिज़ाइन किया गया था. आईएनपी, कुल रिस्पॉन्स का ज़्यादा भरोसेमंद इंडिकेटर है. इससे कोई फ़र्क़ नहीं पड़ता कि पेज पर इंटरैक्शन कब हुआ था.

आईएनपी की कोई वैल्यू रिपोर्ट न करने पर क्या होता है?

यह मुमकिन है कि कोई पेज आईएनपी वैल्यू न दिखाए. ऐसा कई वजहों से हो सकता है. इनमें ये वजहें शामिल हैं:

  • पेज लोड हुआ, लेकिन उपयोगकर्ता ने इससे कभी इंटरैक्ट नहीं किया.
  • पेज लोड हो गया है, लेकिन उपयोगकर्ता ने हाथ के ऐसे जेस्चर का इस्तेमाल करके इंटरैक्ट किया है जिन्हें मापा नहीं जा सकता. जैसे, स्क्रोल करना या एलिमेंट पर कर्सर घुमाना.
  • पेज को कोई ऐसा बॉट ऐक्सेस कर रहा है जिसे पेज से इंटरैक्ट करने के लिए स्क्रिप्ट नहीं किया गया है. जैसे, सर्च क्रॉलर या बिना ग्राफ़िक यूज़र इंटरफ़ेस वाला ब्राउज़र.

आईएनपी को मेज़र करने का तरीका

आईएनपी को फ़ील्ड और लैब, दोनों में मापने के लिए कई तरह के टूल का इस्तेमाल किया जाता है.

खास बातें: अपनी वेबसाइट के आईएनपी को मापने का सबसे अच्छा तरीका है, फ़ील्ड में मौजूद असल उपयोगकर्ताओं की मेट्रिक इकट्ठा करना. अगर आप अक्सर परफ़ॉर्मेंस का आकलन करने के लिए लैब डेटा पर निर्भर हैं, तो हमारा सुझाव है कि लैब और फ़ील्ड डेटा अलग-अलग क्यों हो सकते हैं (और इसके बारे में क्या किया जा सकता है).

मैदान में

आम तौर पर, आईएनपी को ऑप्टिमाइज़ करने की आपकी यात्रा फ़ील्ड डेटा से शुरू होती है. ज़्यादा से ज़्यादा, रीयल यूज़र मॉनिटरिंग (आरयूएम) के फ़ील्ड डेटा से आपको किसी पेज की आईएनपी वैल्यू के साथ-साथ काम का डेटा भी मिलता है. इससे यह पता चलता है कि आईएनपी वैल्यू के लिए कौनसा इंटरैक्शन सही था. इसमें यह भी शामिल होता है कि इंटरैक्शन, पेज लोड होने के दौरान या उसके बाद हुआ, इंटरैक्शन का टाइप (क्लिक, कीप्रेस या टैप) और दूसरी अहम जानकारी.

अगर आपकी वेबसाइट को Chrome इस्तेमाल करने वाले लोगों के अनुभव की रिपोर्ट (CrUX) में शामिल किया जा सकता है, तो आपको PageSpeed Insights में CrUX की मदद से, वेबसाइट की परफ़ॉर्मेंस की अन्य अहम जानकारी के साथ-साथ आईएनपी फ़ील्ड का डेटा तुरंत मिल सकता है. आपको अपनी वेबसाइट के आईएनपी के ऑरिजिन-लेवल की कम से कम तस्वीर मिल सकती है, लेकिन कुछ मामलों में, आपको पेज लेवल का डेटा भी मिल सकता है.

हालांकि, CrUX से आपको यह पता चल सकता है कि बहुत बड़ी समस्या है, लेकिन समस्या को समझने के लिए अक्सर वह पर्याप्त जानकारी नहीं देती. आरयूएम समाधान से आपको ऐसे पेजों, उपयोगकर्ताओं या उपयोगकर्ता के इंटरैक्शन के बारे में ज़्यादा जानकारी मिल सकती है जिनमें देर से इंटरैक्शन होता है. आईएनपी को अलग-अलग इंटरैक्शन में एट्रिब्यूट कर पाने से अनुमान लगाने और बेकार की मेहनत से बचने में मदद मिलती है.

लैब में

आम तौर पर, जब आपके पास ऐसा फ़ील्ड डेटा होता है जिससे आपको यह पता चलता है कि आपके इंटरैक्शन की स्पीड धीमी है, तब लैब में टेस्ट शुरू किया जा सकता है. हालांकि, फ़ील्ड डेटा के मौजूद न होने पर, लैब में धीमे इंटरैक्शन को फिर से पैदा करने के लिए कुछ रणनीतियां हैं. रणनीतियों में उपयोगकर्ता के सामान्य फ़्लो का पालन करना और पेज पर होने वाले इंटरैक्शन की जांच करना शामिल है. साथ ही, जब मुख्य थ्रेड अक्सर ज़्यादा व्यस्त होता है, तब पेज के साथ इंटरैक्ट करना भी शामिल होता है. ऐसा उपयोगकर्ता अनुभव के उस अहम हिस्से के दौरान धीमे इंटरैक्शन को रोकने के लिए किया जाता है.

आईएनपी को बेहतर कैसे बनाएं

फ़ील्ड में धीमे इंटरैक्शन की पहचान करने और उन्हें ऑप्टिमाइज़ करने के लिए लैब डेटा का इस्तेमाल करने के बारे में दिशा-निर्देश पाने के लिए, आईएनपी को ऑप्टिमाइज़ करने से जुड़ी हमारी गाइड का कलेक्शन देखें.

बदलावों का लॉग

कभी-कभी, मेट्रिक को मापने के लिए इस्तेमाल किए जाने वाले एपीआई में गड़बड़ियां मिलती हैं. कभी-कभी मेट्रिक की परिभाषा में भी गड़बड़ियां मिलती हैं. इसलिए, कभी-कभी बदलाव करने पड़ते हैं. ये बदलाव, आपकी इंटरनल रिपोर्ट और डैशबोर्ड में सुधार या रिग्रेशन के तौर पर दिख सकते हैं.

इन्हें मैनेज करने में आपकी मदद के लिए, इन मेट्रिक को लागू करने या इनकी परिभाषा में किए गए सभी बदलाव इस बदलाव लॉग में दिखाए गए हैं.

अगर आपके पास इन मेट्रिक के बारे में कोई सुझाव/शिकायत/राय है, तो उसे वेब-वाइटल-सुझाव/शिकायत/राय वाले Google ग्रुप में दें.