पेज लोड होने की परफ़ॉर्मेंस के डेटा के बारे में जानें (वेब ऐप्लिकेशन)

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

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

  • फ़र्स्ट पेंट — एक मेट्रिक, जो जब उपयोगकर्ता किसी पेज पर जाता है और जब कोई विज़ुअल बदलाव होता है

  • फ़र्स्ट कॉन्टेंटफ़ुल पेंट — यह मेट्रिक, उपयोगकर्ता के किसी पेज पर जाने और काम का कॉन्टेंट देखने के बीच लगने वाला समय डिसप्ले, जैसे कि इमेज या टेक्स्ट

  • domInteractive — एक ऐसी मेट्रिक जो इन दोनों के बीच के समय को मापती है जब उपयोगकर्ता किसी पेज पर जाता है और जब उस पेज को इंटरैक्टिव माना जाता है उपयोगकर्ता के लिए

  • domContentLoadedEventEnd — एक ऐसी मेट्रिक जो उपयोगकर्ता के किसी पेज पर जाने और शुरुआती एचटीएमएल के पेज पर जाने के बीच का समय दस्तावेज़ पूरी तरह से लोड और पार्स हो गया है

  • loadEventEnd — एक मेट्रिक, जो जब उपयोगकर्ता मौजूदा दस्तावेज़ के लोड इवेंट वाले पेज पर जाता है पूरे

  • फ़र्स्ट इनपुट डिले — ऐसी मेट्रिक जो दोनों के बीच के समय को मापती है जब उपयोगकर्ता किसी पेज से इंटरैक्ट करता है और जब ब्राउज़र, पेज का जवाब देने के लिए तैयार हो जाता है वह इनपुट

आप ट्रेस टेबल, जो परफ़ॉर्मेंस डैशबोर्ड में सबसे नीचे मौजूद होती है (ज़्यादा जानें कंसोल का इस्तेमाल करने के बारे में बाद में बताया गया है).

पेज लोड ट्रेस की परिभाषा

यह ट्रेस, आपके ऐप्लिकेशन में पेज लोड होने, खास तौर पर, पेज लोड होने के सामान्य पॉइंट तक पहुंचने में कितना समय लगता है, जैसे कि रिस्पॉन्सिव ऐप्लिकेशन.

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

पेज लोड ट्रेस के लिए इकट्ठा की गई मेट्रिक

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

फ़र्स्ट पेंट

इस मेट्रिक से यह पता चलता है कि उपयोगकर्ता किसी पेज पर कब गया. साथ ही, कोई भी विज़ुअल परिवर्तन होता है.

यह मेट्रिक आपके उपयोगकर्ताओं को सबसे पहले इस बात का संकेत देती है कि लोड शुरू हो रहा है.

  • यह तब शुरू होता है, जब उपयोगकर्ता किसी पेज पर जाता है.

  • यह विकल्प तब बंद हो जाता है, जब कोई विज़ुअल बदलाव होता है. इसमें बैकग्राउंड का रंग बदलना या एक हेडर लोड हो रहा है.

पहला कॉन्टेंटफ़ुल पेंट

इस मेट्रिक से यह पता चलता है कि उपयोगकर्ता किसी पेज पर कब गया. साथ ही, काम का कॉन्टेंट दिखाया जाता है, जैसे कि इमेज या टेक्स्ट.

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

  • यह तब शुरू होता है, जब उपयोगकर्ता किसी पेज पर जाता है.

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

डॉमइंटरैक्टिव

इस मेट्रिक से यह पता चलता है कि उपयोगकर्ता किसी पेज पर कब गया. साथ ही, पेज को उपयोगकर्ता के लिए इंटरैक्टिव माना जाता है.

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

  • यह तब शुरू होता है, जब उपयोगकर्ता किसी पेज पर जाता है.

  • उपयोगकर्ता एजेंट के वर्तमान HTML दस्तावेज़ के सेट करने से ठीक पहले रुक जाता है "इंटरैक्टिव" के लिए रेडीनेस स्कोर.

domContentLoadedEventEnd

इस मेट्रिक से यह पता चलता है कि उपयोगकर्ता किसी पेज पर कब गया. साथ ही, HTML दस्तावेज़ पूरी तरह से लोड और पार्स होता है.

  • यह तब शुरू होता है, जब उपयोगकर्ता किसी पेज पर जाता है.

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

लोडइवेंट खत्म

इस मेट्रिक से, उपयोगकर्ता के किसी पेज पर जाने के बीच लगने वाले समय और जब मौजूदा दस्तावेज़ का लोड इवेंट पूरा हो जाता है.

इस मेट्रिक से आपको यह समझने में मदद मिलती है कि आपके सभी प्रॉडक्ट को लोड होने में कितना समय लगता है इसमें स्टाइलशीट और इमेज शामिल हैं.

  • यह तब शुरू होता है, जब उपयोगकर्ता किसी पेज पर जाता है.

  • मौजूदा एचटीएमएल दस्तावेज़ का लोड इवेंट पूरा होने के तुरंत बाद रुक जाता है.

फ़र्स्ट इनपुट डिले

इस मेट्रिक से, उपयोगकर्ता के किसी पेज से इंटरैक्ट करने के बीच के समय और जब ब्राउज़र उस इनपुट का जवाब दे पाए.

यह मेट्रिक इसलिए फ़ायदेमंद है, क्योंकि उपयोगकर्ता इंटरैक्शन का जवाब देने वाला ब्राउज़र आपके ऐप्लिकेशन के रिस्पॉन्सिव होने के बारे में, आपके उपयोगकर्ताओं का पहला इंप्रेशन.

  • यह तब शुरू होता है, जब उपयोगकर्ता पहली बार पेज पर मौजूद किसी एलिमेंट से इंटरैक्ट करता है, जैसे कि किसी बटन या हाइपरलिंक पर क्लिक करके.

  • ब्राउज़र, इनपुट का जवाब दे देता है, तो तुरंत रुक जाता है. इसका मतलब है कि कि ब्राउज़र आपकी सामग्री को लोड या पार्स करने में व्यस्त नहीं है.

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

परफ़ॉर्मेंस डेटा को ट्रैक करना, देखना, और फ़िल्टर करना

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

अपने डैशबोर्ड में मुख्य मेट्रिक ट्रैक करें

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

Firebase की परफ़ॉर्मेंस मॉनिटर करने वाले डैशबोर्ड में मौजूद मेट्रिक बोर्ड की इमेज

अपने मेट्रिक बोर्ड में कोई मेट्रिक जोड़ने के लिए, यह तरीका अपनाएं:

  1. YouTube Studio के Firebase कंसोल में, परफ़ॉर्मेंस डैशबोर्ड.
  2. किसी खाली मेट्रिक कार्ड पर क्लिक करें. इसके बाद, अपने बोर्ड में जोड़ने के लिए कोई मौजूदा मेट्रिक चुनें.
  3. क्लिक करें ज़्यादा विकल्पों के लिए, अपने-आप जानकारी वाले मेट्रिक कार्ड पर , का इस्तेमाल किया जा सकता है.

यह मेट्रिक बोर्ड, समय के साथ इकट्ठा किए गए मेट्रिक डेटा को ग्राफ़िक के तौर पर और संख्या में प्रतिशत में बदलाव.

डैशबोर्ड का इस्तेमाल करने के बारे में ज़्यादा जानें.

ट्रेस और उनका डेटा देखें

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

परफ़ॉर्मेंस मॉनिटर करने की सुविधा, Firebase कंसोल में समस्या हल करने वाला पेज उपलब्ध कराती है. इस पेज पर मेट्रिक को हाइलाइट किया जाता है में बदलाव किए गए हैं, जिससे आपके विज्ञापनों को तेज़ी से हल करना और परफ़ॉर्मेंस की समस्याओं को कम करना आसान हो जाता है के बारे में बात करते हैं. समस्या के हल के बारे में जानने के लिए, समस्या हल करने वाले पेज का इस्तेमाल करें परफ़ॉर्मेंस की समस्याएं देख सकते हैं, उदाहरण के लिए, इन स्थितियों में:

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

समस्या हल करने वाले पेज को इन तरीकों से ऐक्सेस किया जा सकता है:

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

ट्रेस टेबल में किसी ट्रेस के नाम पर क्लिक करने पर, उसकी मेट्रिक में ड्रिल-डाउन किया जा सकता है रुचि. क्लिक करें डेटा को फ़िल्टर करने के लिए, फ़िल्टर करें बटन विशेषता के आधार पर, उदाहरण के लिए:

Firebase की परफ़ॉर्मेंस मॉनिटर करने से जुड़े डेटा की इमेज, जिसे एट्रिब्यूट के हिसाब से फ़िल्टर किया जा रहा है
  • अपनी साइट के किसी खास पेज का डेटा देखने के लिए, पेज यूआरएल के हिसाब से फ़िल्टर करें
  • 3g कनेक्शन का आपके कैंपेन पर क्या असर होता है, यह जानने के लिए असरदार कनेक्शन के टाइप के हिसाब से फ़िल्टर करें ऐप्स
  • देश के हिसाब से फ़िल्टर करके, पक्का करें कि आपके डेटाबेस की जगह के किसी खास हिस्से पर असर न पड़ रहा हो प्रांत

इसके बारे में ज़्यादा जानें इसके लिए डेटा देखना ट्रैक करें.

अगले चरण