Check out what’s new from Firebase at Google I/O 2022. Learn more

पृष्ठ लोडिंग प्रदर्शन डेटा (वेब ​​ऐप्स) के बारे में जानें

प्रदर्शन निगरानी आपके ऐप में निगरानी की जाने वाली प्रक्रियाओं के बारे में डेटा एकत्र करने के लिए ट्रेस का उपयोग करती है। ट्रेस एक ऐसी रिपोर्ट होती है जिसमें आपके ऐप में दो समय के बीच कैप्चर किया गया डेटा होता है।

वेब ऐप्स के लिए, प्रदर्शन निगरानी स्वचालित रूप से आपके ऐप के प्रत्येक पृष्ठ के लिए एक ट्रेस एकत्र करती है जिसे पेज लोड ट्रेस कहा जाता है। प्रत्येक पृष्ठ लोड ट्रेस निम्न डिफ़ॉल्ट मीट्रिक एकत्रित करता है:

  • पहला पेंट — एक मीट्रिक जो उस समय को मापता है जब उपयोगकर्ता किसी पृष्ठ पर नेविगेट करता है और जब कोई दृश्य परिवर्तन होता है

  • पहला संतोषजनक पेंट - एक मीट्रिक जो उस समय को मापता है जब कोई उपयोगकर्ता किसी पृष्ठ पर नेविगेट करता है और जब सार्थक सामग्री प्रदर्शित होती है, जैसे छवि या टेक्स्ट

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

  • domContentLoadedEventEnd — एक मीट्रिक जो उस समय को मापता है जब उपयोगकर्ता किसी पृष्ठ पर नेविगेट करता है और जब प्रारंभिक HTML दस्तावेज़ पूरी तरह से लोड और पार्स किया जाता है

  • loadEventEnd — एक मीट्रिक जो उस समय को मापता है जब उपयोगकर्ता पृष्ठ पर नेविगेट करता है और जब वर्तमान दस्तावेज़ का लोड ईवेंट पूरा होता है

  • पहला इनपुट विलंब - एक मीट्रिक जो उस समय को मापता है जब उपयोगकर्ता किसी पृष्ठ के साथ इंटरैक्ट करता है और जब ब्राउज़र उस इनपुट का जवाब देने में सक्षम होता है

आप ट्रेस तालिका के पृष्ठ लोड उपटैब में इन ट्रेस से डेटा देख सकते हैं, जो प्रदर्शन डैशबोर्ड के नीचे है (इस पृष्ठ पर बाद में कंसोल का उपयोग करने के बारे में और जानें)।

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

यह ट्रेस इस बारे में कई मीट्रिक मापता है कि आपके ऐप में पेज कैसे लोड होते हैं, विशेष रूप से एक रिस्पॉन्सिव ऐप जैसे सामान्य लोडिंग पॉइंट तक पहुंचने में कितना समय लगता है।

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

पेज लोड ट्रेस के लिए एकत्रित मीट्रिक

ये ट्रेस आउट-ऑफ़-द-बॉक्स ट्रेस हैं, इसलिए आप इनमें कस्टम मीट्रिक या कस्टम विशेषताएं नहीं जोड़ सकते हैं।

पहला पेंट

यह मीट्रिक उस समय को मापता है जब उपयोगकर्ता किसी पृष्ठ पर नेविगेट करता है और जब कोई दृश्य परिवर्तन होता है।

यह मीट्रिक उपयोगी है क्योंकि पहला पेंट आपके उपयोगकर्ताओं को संकेत देता है कि पृष्ठ लोड होना शुरू हो रहा है।

  • तब प्रारंभ होता है जब उपयोगकर्ता किसी पृष्ठ पर नेविगेट करता है।

  • पृष्ठभूमि का रंग बदलने या हेडर लोड करने सहित कोई भी दृश्य परिवर्तन होने पर रुक जाता है।

पहला संतोषजनक पेंट

यह मीट्रिक उस समय को मापता है जब कोई उपयोगकर्ता किसी पृष्ठ पर नेविगेट करता है और जब सार्थक सामग्री प्रदर्शित होती है, जैसे छवि या टेक्स्ट।

यह मीट्रिक इस जानकारी के लिए उपयोगी है कि आपके उपयोगकर्ता केवल एक नए पृष्ठभूमि रंग या हेडर के बजाय आपके ऐप की किसी भी वास्तविक सामग्री को कितनी जल्दी देखते हैं।

  • तब प्रारंभ होता है जब उपयोगकर्ता किसी पृष्ठ पर नेविगेट करता है।

  • किसी भी पाठ, छवि (पृष्ठभूमि छवियों सहित), गैर-सफेद कैनवास, या एसवीजी सहित, डीओएम से पहली सामग्री प्रस्तुत करने के तुरंत बाद ब्राउज़र बंद हो जाता है।

डोम इंटरएक्टिव

यह मीट्रिक उस समय को मापता है जब उपयोगकर्ता किसी पृष्ठ पर नेविगेट करता है और जब पृष्ठ को उपयोगकर्ता के लिए इंटरैक्टिव माना जाता है।

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

  • तब प्रारंभ होता है जब उपयोगकर्ता किसी पृष्ठ पर नेविगेट करता है।

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

domContentLoadedEventEnd

यह मीट्रिक उस समय को मापता है जब उपयोगकर्ता किसी पृष्ठ पर नेविगेट करता है और जब प्रारंभिक HTML दस्तावेज़ पूरी तरह से लोड और पार्स किया जाता है।

  • तब प्रारंभ होता है जब उपयोगकर्ता किसी पृष्ठ पर नेविगेट करता है।

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

लोडइवेंटएंड

यह मीट्रिक उस समय को मापता है जब उपयोगकर्ता पृष्ठ पर नेविगेट करता है और जब वर्तमान दस्तावेज़ का लोड ईवेंट पूरा होता है।

यह मीट्रिक इस जानकारी के लिए उपयोगी है कि स्टाइलशीट और छवियों सहित आपकी सभी सामग्री को लोड करने में कितना समय लगता है।

  • तब प्रारंभ होता है जब उपयोगकर्ता किसी पृष्ठ पर नेविगेट करता है।

  • वर्तमान HTML दस्तावेज़ के लोड ईवेंट के पूर्ण होने के तुरंत बाद रुक जाता है।

पहली इनपुट देरी

यह मीट्रिक उस समय को मापता है जब उपयोगकर्ता किसी पृष्ठ के साथ इंटरैक्ट करता है और जब ब्राउज़र उस इनपुट का जवाब देने में सक्षम होता है।

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

  • शुरू होता है जब उपयोगकर्ता पहली बार पृष्ठ पर किसी तत्व के साथ इंटरैक्ट करता है, जैसे बटन या हाइपरलिंक पर क्लिक करना।

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

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

प्रदर्शन डेटा ट्रैक करें, देखें और फ़िल्टर करें

रीयल टाइम परफ़ॉर्मेंस डेटा देखने के लिए, पक्का करें कि आपका ऐप परफ़ॉर्मेंस मॉनिटरिंग SDK वर्शन का इस्तेमाल करता है जो रीयल टाइम डेटा प्रोसेसिंग के साथ संगत है। और जानें

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

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

Firebase प्रदर्शन निगरानी डैशबोर्ड में मीट्रिक बोर्ड की एक छवि

अपने मीट्रिक बोर्ड में मीट्रिक जोड़ने के लिए, Firebase कंसोल में प्रदर्शन डैशबोर्ड पर जाएं, फिर डैशबोर्ड टैब पर क्लिक करें. एक खाली मीट्रिक कार्ड पर क्लिक करें, फिर अपने बोर्ड में जोड़ने के लिए एक मौजूदा मीट्रिक चुनें। किसी मीट्रिक को बदलने या निकालने जैसे अधिक विकल्पों के लिए किसी आबादी वाले मीट्रिक कार्ड पर पर क्लिक करें।

मेट्रिक्स बोर्ड समय के साथ एकत्र किए गए मीट्रिक डेटा को ग्राफिकल रूप में और संख्यात्मक प्रतिशत परिवर्तन के रूप में दिखाता है।

डैशबोर्ड का उपयोग करने के बारे में और जानें।

निशान और उनका डेटा देखें

अपने निशान देखने के लिए, फायरबेस कंसोल में प्रदर्शन डैशबोर्ड पर जाएं, ट्रेस तालिका तक नीचे स्क्रॉल करें, फिर उपयुक्त उपटैब पर क्लिक करें। तालिका प्रत्येक ट्रेस के लिए कुछ शीर्ष मीट्रिक प्रदर्शित करती है, और आप किसी विशिष्ट मीट्रिक के लिए प्रतिशत परिवर्तन के आधार पर सूची को क्रमबद्ध भी कर सकते हैं।

यदि आप ट्रेस तालिका में ट्रेस नाम पर क्लिक करते हैं, तो आप ट्रेस का पता लगाने के लिए विभिन्न स्क्रीन पर क्लिक कर सकते हैं और रुचि के मीट्रिक में ड्रिल डाउन कर सकते हैं। अधिकांश पृष्ठों पर, आप विशेषता के आधार पर डेटा को फ़िल्टर करने के लिए फ़िल्टर बटन (स्क्रीन के ऊपरी-बाएँ) का उपयोग कर सकते हैं, उदाहरण के लिए:

विशेषता द्वारा फ़िल्टर किए जा रहे Firebase प्रदर्शन निगरानी डेटा की एक छवि
  • अपनी साइट के किसी विशिष्ट पृष्ठ का डेटा देखने के लिए पृष्ठ URL द्वारा फ़िल्टर करें
  • 3जी कनेक्शन आपके ऐप को कैसे प्रभावित करता है, यह जानने के लिए प्रभावी कनेक्शन प्रकार के आधार पर फ़िल्टर करें
  • यह सुनिश्चित करने के लिए देश के आधार पर फ़िल्टर करें कि आपका डेटाबेस स्थान किसी विशिष्ट क्षेत्र को प्रभावित नहीं कर रहा है

अपने ट्रेस के लिए डेटा देखने के बारे में और जानें।

अगले कदम

  • प्रदर्शन डेटा की जांच करने के लिए विशेषताओं का उपयोग करने के बारे में अधिक जानें।

  • Firebase कंसोल में प्रदर्शन समस्याओं को ट्रैक करने के तरीके के बारे में और जानें।

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