Chrome की UX रिपोर्ट में, फ़र्स्ट इनपुट डिले के साथ प्रयोग करना

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

Rick Viscomi

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

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

एफ़आईडी को कैसे मेज़र किया जाता है

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

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

इस ऐनिमेशन में दिखाया गया है कि किसी मुख्य थ्रेड के व्यस्त होने पर, उपयोगकर्ता के इंटरैक्शन के जवाब में देरी कैसे होती है.

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

Chrome UX रिपोर्ट में एफ़आईडी के बारे में जानकारी

लाखों ऑरिजिन से मिले एक महीने के एफ़आईडी डेटा से, पहले से ही कई अहम जानकारी मिल सकती है. आइए, कुछ क्वेरी देखें, जिनसे BigQuery पर Chrome UX रिपोर्ट से इनसाइट निकालने का तरीका पता चलता है.

developers.google.com के लिए, तेज़ एफ़आईडी अनुभव के प्रतिशत के बारे में क्वेरी करके शुरू करें. तेज़ अनुभव का मतलब है कि एफ़आईडी 100 मिलीसेकंड से कम हो. RAIL के सुझावों के मुताबिक, अगर देरी 100 मिलीसेकंड या उससे कम है, तो उपयोगकर्ता को तुरंत अनुभव मिलना चाहिए.

SELECT
  ROUND(SUM(IF(fid.start < 100, fid.density, 0)), 4) AS fast_fid
FROM
  `chrome-ux-report.all.201806`,
  UNNEST(experimental.first_input_delay.histogram.bin) AS fid
WHERE
  origin = 'https://developers.google.com'

नतीजों से पता चलता है कि इस ऑरिजिन पर 95% एफ़आईडी अनुभव, तुरंत के तौर पर महसूस किए जाते हैं. यह काफ़ी अच्छा लगता है, लेकिन डेटासेट में मौजूद सभी ऑरिजिन की तुलना में यह कैसा है?

SELECT
  ROUND(SUM(IF(fid.start < 100, fid.density, 0)) / SUM(fid.density), 4) AS fast_fid
FROM
  `chrome-ux-report.all.201806`,
  UNNEST(experimental.first_input_delay.histogram.bin) AS fid

इस क्वेरी के नतीजों से पता चलता है कि 84% एफ़आईडी 100 मिलीसेकंड से कम हैं. इसलिए, developers.google.com का एफ़आईडी औसत से ज़्यादा है.

ध्यान दें: यह समय-समय पर आपको याद दिलाने के लिए भी है कि डेटासेट में, ऑरिजिन की लोकप्रियता कहीं भी नहीं दिखाई जाती. इसलिए, किसी ऐसे ऑरिजिन की डेंसिटी, जिसमें कुछ ही लाख उपयोगकर्ताओं को तुरंत एफ़आईडी का अनुभव मिलता है, वही हो सकती है जो तुरंत एफ़आईडी का अनुभव देने वाले कुछ ही सौ उपयोगकर्ताओं वाले ऑरिजिन की होती है.

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

SELECT
  form_factor.name AS form_factor,
  ROUND(SUM(IF(fid.start < 100, fid.density, 0)) / SUM(fid.density), 4) AS fast_fid
FROM
  `chrome-ux-report.all.201806`,
  UNNEST(experimental.first_input_delay.histogram.bin) AS fid
GROUP BY
  form_factor

form_factor	fast_fid
डेस्कटॉप	96.02%
फ़ोन	79.90%
टैबलेट	76.48%

नतीजों से हमारे अनुमान की पुष्टि होती है. फ़ोन और टैबलेट फ़ॉर्म फ़ैक्टर की तुलना में, डेस्कटॉप पर तेज़ एफ़आईडी अनुभवों की कुल संख्या ज़्यादा है. सीपीयू की परफ़ॉर्मेंस जैसे अंतर क्यों मौजूद हैं, यह समझने के लिए Chrome UX रिपोर्ट के दायरे से बाहर की A/B टेस्टिंग की ज़रूरत होगी.

अब हमने यह जान लिया है कि किसी ऑरिजिन में एफ़आईडी का अनुभव तेज़ है या नहीं, यह कैसे पता लगाया जा सकता है. अब चलिए, कुछ ऐसे ऑरिजिन पर नज़र डालते हैं जो काफ़ी अच्छी परफ़ॉर्म करते हैं.

पहला उदाहरण: http://secretlycanadian.com

इस ऑरिजिन के 98% एफ़आईडी 100 मिलीसेकंड से कम के हैं. ऐसा कैसे हुआ? WebPageTest में, इस पेज के बनने का तरीका विश्लेषण करने पर, हमें पता चलता है कि यह WordPress का एक ऐसा पेज है जिसमें बहुत सारी इमेज हैं. हालांकि, इसमें 168 केबी का JavaScript है, जो हमारी लैब मशीन पर करीब 500 मिलीसेकंड में काम करता है. एचटीटीपी संग्रह के मुताबिक, यह बहुत ज़्यादा JavaScript नहीं है. इस वजह से, इस पेज को 28वें प्रतिशत में रखा गया है.

2.7 से 3.0 सेकंड तक का गुलाबी बार, एचटीएमएल पार्स करने का फ़ेज़ है. इस दौरान, पेज इंटरैक्टिव नहीं होता और यह विज़ुअल रूप से अधूरा दिखता है. ऊपर दी गई फ़िल्मस्ट्रिप में “3.0s” देखें. इसके बाद, जिन लंबे टास्क को प्रोसेस करना ज़रूरी है उन्हें अलग-अलग हिस्सों में बांट दिया जाता है, ताकि मुख्य थ्रेड में कोई रुकावट न आए. 11वीं पंक्ति पर मौजूद गुलाबी रंग की लाइनें दिखाती हैं कि JavaScript का काम तेज़ी से कैसे होता है.

दूसरा उदाहरण: https://www.wtfast.com

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

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

एक्सप्लोर करना शुरू करें

The State of the Web के इस हफ़्ते के एपिसोड में, एफ़आईडी के बारे में ज़्यादा जानें:

Chrome UX रिपोर्ट में एफ़आईडी की जानकारी उपलब्ध होने से, हमें इंटरैक्टिव अनुभव का आधार तय करने में मदद मिलती है. इस बेसलाइन का इस्तेमाल करके, हम आने वाले समय में होने वाले बदलावों को देख सकते हैं या अलग-अलग ऑरिजिन को बेंचमार्क कर सकते हैं. अगर आपको अपनी साइट के फ़ील्ड मेज़रमेंट में एफ़आईडी इकट्ठा करना है, तो bit.ly/event-timing-ot पर जाकर, ऑरिजिन ट्रायल के लिए साइन अप करें और इवेंट टाइमिंग की सुविधा चुनें. साथ ही, वेब पर इंटरैक्टिविटी की स्थिति के बारे में दिलचस्प जानकारी पाने के लिए, डेटासेट को एक्सप्लोर करना शुरू करें. यह अब भी एक्सपेरिमेंट के तौर पर उपलब्ध मेट्रिक है. इसलिए, कृपया हमें अपना सुझाव/राय दें और Chrome UX रिपोर्ट के चर्चा ग्रुप या Twitter पर @ChromeUXReport पर अपना विश्लेषण शेयर करें.