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

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

अगर आपने अभी तक ऐसा नहीं किया है, तो अपने 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();

दूसरा चरण: इनपुट में लगने वाली देरी की polyfill लाइब्रेरी जोड़ना

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

अगले चरण