वेब के लिए परफ़ॉर्मेंस मॉनिटर करने की सुविधा का इस्तेमाल शुरू करना

वेब कंटेनर इंस्टॉल करने से पहले

अगर आपने पहले से ऐसा नहीं किया है, तो Firebase को अपने JavaScript प्रोजेक्ट में जोड़ें पर जाकर, ये काम करने का तरीका जानें:

  • Firebase प्रोजेक्ट बनाना

  • अपने वेब ऐप्लिकेशन को Firebase के साथ रजिस्टर करें

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

पहला चरण: परफ़ॉर्मेंस मॉनिटर करने की सुविधा जोड़ना और शुरू करना

  1. अगर आपने पहले से ऐसा नहीं किया है, तो Firebase JS SDK टूल इंस्टॉल करें और Firebase शुरू करें.

  2. परफ़ॉर्मेंस मॉनिटर करने के लिए, JS SDK टूल जोड़ें और परफ़ॉर्मेंस मॉनिटरिंग शुरू करें:

Web 

import { initializeApp } from "firebase/app";
import { getPerformance } from "firebase/performance";

// TODO: Replace the following with your app's Firebase project configuration
// See: https://firebase.google.com/docs/web/learn-more#config-object
const firebaseConfig = {
  // ...
};

// Initialize Firebase
const app = initializeApp(firebaseConfig);


// Initialize Performance Monitoring and get a reference to the service
const perf = getPerformance(app);

Web 

import firebase from "firebase/compat/app";
import "firebase/compat/performance";

// TODO: Replace the following with your app's Firebase project configuration
// See: https://firebase.google.com/docs/web/learn-more#config-object
const firebaseConfig = {
  // ...
};

// Initialize Firebase
firebase.initializeApp(firebaseConfig);


// Initialize Performance Monitoring and get a reference to the service
const perf = firebase.performance();

दूसरा चरण: पहली इनपुट डिले पॉलीफ़िल लाइब्रेरी जोड़ना

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

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

तीसरा चरण: शुरुआती डेटा दिखाने के लिए परफ़ॉर्मेंस इवेंट जनरेट करना

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

  1. स्थानीय वातावरण में अपना वेब ऐप्लिकेशन उपलब्ध कराएं और देखें.

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

  3. Firebase कंसोल के परफ़ॉर्मेंस डैशबोर्ड पर जाएं. आपको कुछ ही मिनटों में अपना शुरुआती डेटा दिखेगा.

    अगर आपको अपना शुरुआती डेटा नहीं दिखता है, तो समस्या हल करने की सलाह देखें.

चौथा चरण: (ज़रूरी नहीं) परफ़ॉर्मेंस इवेंट के लॉग मैसेज देखें

  1. अपने ब्राउज़र के डेवलपर टूल खोलें (उदाहरण के लिए, Chrome Dev टूल के लिए नेटवर्क टैब या Firefox के लिए नेटवर्क मॉनिटर में).

  2. ब्राउज़र में अपने वेब ऐप्लिकेशन को रीफ़्रेश करें.

  3. गड़बड़ी के किसी भी मैसेज के लिए अपने लॉग मैसेज देखें.

  4. कुछ सेकंड के बाद, अपने ब्राउज़र के डेवलपर टूल में firebaselogging.googleapis.com को नेटवर्क कॉल करने का विकल्प ढूंढें. उस नेटवर्क कॉल की मौजूदगी से पता चलता है कि ब्राउज़र, Firebase को परफ़ॉर्मेंस डेटा भेज रहा है.

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

पांचवां चरण: (ज़रूरी नहीं) किसी कोड के लिए, अपने हिसाब से मॉनिटरिंग की सुविधा चालू करना

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

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

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

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

छठा चरण: अपना ऐप्लिकेशन डिप्लॉय करें और फिर नतीजों की समीक्षा करें

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

Firebase कंसोल के परफ़ॉर्मेंस डैशबोर्ड में जाकर, परफ़ॉर्मेंस डेटा को मॉनिटर किया जा सकता है.

अगले चरण