بدء استخدام ميزة "مراقبة الأداء" للويب

قبل البدء

إذا لم تكن قد قمت بذلك بالفعل، فقم بزيارة يمكنك إضافة Firebase إلى مشروع JavaScript للتعرُّف على كيفية:

  • إنشاء مشروع على Firebase

  • تسجيل تطبيق الويب في Firebase

تجدر الإشارة إلى أنّه عند إضافة منصة Firebase إلى تطبيقك، يمكنك إكمال بعض الخطوات الموضحة لاحقًا في هذه الصفحة (على سبيل المثال، إضافة حزمة SDK وإعداد Firebase).

الخطوة 1: إضافة ميزة "مراقبة الأداء" وإعدادها

  1. إذا لم تكن قد قمت بذلك بالفعل، تثبيت حزمة تطوير البرامج (SDK) لـ Firebase JS وإعداد 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();

الخطوة 2: إضافة مكتبة polyfill لتأخير الإدخال الأول

لقياس مقياس تأخير الإدخال الأول، ستحتاج إلى إضافة مكتبة polyfill لهذا المقياس. للتثبيت راجع القسم الخاص بالمكتبة المستندات.

لا حاجة إلى إضافة مكتبة polyfill هذه لتتمكّن ميزة "مراقبة الأداء" من الإبلاغ عن المحتوى الآخر. ومقاييس تطبيق الويب.

الخطوة 3: إنشاء أحداث الأداء للعرض الأولي للبيانات

يبدأ Firebase في معالجة الأحداث عند إضافة حزمة تطوير البرامج (SDK) بنجاح إلى التطبيق. إذا كنت لا تزال في مرحلة التطوير محليًا، تفاعَل مع تطبيقك لإنشاء الأحداث لجمع البيانات الأولية ومعالجتها.

  1. عرض تطبيق الويب وعرضه في بيئة محلية.

  2. يمكنك إنشاء أحداث بتحميل صفحات فرعية لموقعك والتفاعل مع و/أو تنفيذ طلبات الشبكة. احرص على الاحتفاظ بعلامة تبويب المتصفّح مفتوحًا لمدة 10 ثوانٍ على الأقل بعد تحميل الصفحة.

  3. انتقِل إلى لوحة بيانات الأداء بوحدة تحكم Firebase. يجب أن تظهر بياناتك الأولية داخل بضع دقائق.

    إذا لم يتم عرض بياناتك الأولية، راجع أداة تحري الخلل وإصلاحه النصائح.

الخطوة 4: (اختياري) عرض رسائل السجلّ لأحداث الأداء

  1. افتح أدوات المطوّرين في متصفحك (على سبيل المثال، علامة التبويب "الشبكة" في "أدوات مطوري البرامج في Chrome" أو في Network Monitor for Firefox).

  2. أعِد تحميل تطبيق الويب في المتصفّح.

  3. تحقَّق من رسائل السجلّ بحثًا عن أي رسائل خطأ.

  4. بعد بضع ثوانٍ، ابحث عن مكالمة شبكة firebaselogging.googleapis.com في أدوات المطوّرين في متصفّحك تشير رسالة الأشكال البيانية ظهور اتصال الشبكة هذا بأن المتصفح يرسل بيانات الأداء إلى Firebase.

إذا لم يكن تطبيقك يسجّل أحداث الأداء، راجِع مقالة تحديد المشاكل وحلّها. النصائح.

الخطوة 5: (اختيارية) إضافة تتبُّع مخصّص لرمز معيّن

لمراقبة بيانات الأداء المرتبطة برمز محدّد في تطبيقك، يمكنك: تتبُّعات الرموز المخصّصة للأداة.

يمكنك من خلال عملية تتبُّع مخصّصة للرموز قياس المدة التي يستغرقها إكمال تطبيقك. مهمة محددة أو مجموعة من المهام، مثل تحميل مجموعة من الصور أو إرسال طلبات بحث قاعدة البيانات لديك. يكون المقياس التلقائي لتتبُّع الرمز المخصّص هو مدته، ولكن يمكنك أيضًا إضافة مقاييس مخصّصة، مثل نتائج ذاكرة التخزين المؤقت وتحذيرات الذاكرة.

في التعليمة البرمجية، يمكنك تحديد بداية ونهاية عملية تتبُّع الرمز المخصّص ( إضافة أي مقاييس مخصّصة مطلوبة) باستخدام واجهة برمجة التطبيقات التي توفرها حزمة تطوير البرامج (SDK) لمراقبة الأداء.

انتقِل إلى مقالة إضافة ميزة تتبُّع رمز محدّد. لمزيد من المعلومات عن هذه الميزات وكيفية إضافتها إلى تطبيقك.

الخطوة 6: نشر تطبيقك ثم مراجعة النتائج

بعد التحقق من مراقبة الأداء، يمكنك نشر الإصدار المحدّث من تطبيقك للمستخدمين.

يمكنك مراقبة بيانات الأداء في صفحة الأداء لوحة بيانات وحدة تحكم Firebase.

الخطوات التالية