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

शुरू करने से पहले

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

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

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

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

पहला चरण: जोड़ना और उसे सेटअप करना Performance Monitoring

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

  2. Performance Monitoring JS SDK टूल जोड़ें और Performance Monitoring को सेटअप करें:

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();

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

छठा चरण: अपना ऐप्लिकेशन डिप्लॉय करना और फिर नतीजे देखना

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

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

अगले चरण