Catch up on everything announced at Firebase Summit, and learn how Firebase can help you accelerate app development and run your app with confidence. Learn More

Agregue monitoreo personalizado para código de aplicación específico

Organiza tus páginas con colecciones Guarda y categoriza el contenido según tus preferencias.

Performance Monitoring recopila rastros para ayudarlo a monitorear el rendimiento de su aplicación. Un seguimiento es un informe de los datos de rendimiento capturados entre dos puntos en el tiempo en su aplicación.

Puede crear sus propios seguimientos para monitorear los datos de rendimiento asociados con un código específico en su aplicación. Con un seguimiento de código personalizado , puede medir cuánto tiempo le toma a su aplicación completar una tarea específica o un conjunto de tareas, por ejemplo, cargar un conjunto de imágenes o consultar su base de datos.

La métrica predeterminada para un seguimiento de código personalizado es su "duración" (el tiempo entre los puntos de inicio y finalización del seguimiento), pero también puede agregar métricas personalizadas .

En su código, define el principio y el final de un seguimiento de código personalizado mediante las API proporcionadas por el SDK de Performance Monitoring.Los seguimientos de código personalizados se pueden iniciar en cualquier momento después de que se hayan creado y son seguros para subprocesos.

Dado que la métrica predeterminada recopilada para estos seguimientos es "duración", a veces se denominan "seguimientos de duración".

Puede ver los datos de estos seguimientos en la subpestaña Seguimientos personalizados de la tabla de seguimientos, que se encuentra en la parte inferior del panel de rendimiento (obtenga más información sobre el uso de la consola más adelante en esta página).

Atributos predeterminados, atributos personalizados y métricas personalizadas

Para seguimientos de códigos personalizados, Performance Monitoring registra automáticamente atributos predeterminados (metadatos comunes como país, navegador, URL de página, etc.) para que pueda filtrar los datos del seguimiento en Firebase console. También puede agregar y monitorear atributos personalizados (como el nivel del juego o las propiedades del usuario).

Además, puede configurar un seguimiento de código personalizado para registrar métricas personalizadas para eventos relacionados con el rendimiento que ocurren dentro del alcance del seguimiento. Por ejemplo, puede crear una métrica personalizada para la cantidad de aciertos y errores de caché o la cantidad de veces que la interfaz de usuario deja de responder durante un período de tiempo considerable.

Los atributos personalizados y las métricas personalizadas se muestran en Firebase console junto con los atributos predeterminados y la métrica predeterminada para el seguimiento.

Agregar seguimientos de código personalizados

Utilice la API de seguimiento de supervisión de rendimiento para agregar seguimientos de código personalizados para supervisar el código de aplicación específico.

Tenga en cuenta lo siguiente:

  • Una aplicación puede tener varios seguimientos de código personalizados.
  • Se puede ejecutar más de un seguimiento de código personalizado al mismo tiempo.
  • Los nombres para los seguimientos de código personalizados deben cumplir los siguientes requisitos: sin espacios en blanco iniciales ni finales, sin caracteres de subrayado ( _ ) iniciales y una longitud máxima de 100 caracteres.
  • Los seguimientos de código personalizados admiten la adición de métricas personalizadas y atributos personalizados .

Para iniciar y detener un seguimiento de código personalizado, ajuste el código que desea rastrear con líneas de código similares a las siguientes:

Web version 9

import { trace } from "firebase/performance";

const t = trace(perf, "CUSTOM_TRACE_NAME");
t.start();

// Code that you want to trace 
// ...

t.stop();

Web version 8

const trace = perf.trace("CUSTOM_TRACE_NAME");
trace.start();

// Code that you want to trace 
// ...

trace.stop();

Agregar seguimientos de código personalizados mediante la API de sincronización de usuarios

Además de la API de seguimiento de supervisión de rendimiento, puede agregar seguimientos de código personalizados utilizando la API de sincronización de usuario nativa de un navegador. El SDK de Performance Monitoring recoge automáticamente la duración de un seguimiento medida con esta API. El uso de User Timing API es especialmente útil si prefiere cargar el SDK de Performance Monitoring de forma asíncrona. Una vez que se inicializa el SDK, el SDK registrará las mediciones que ocurrieron antes de su carga.

Para usar esta función, envuelva el código que desea rastrear con marcas de tiempo de usuario:

Web version 9

const performance = window.performance;

performance.mark("measurementStart");

// Code that you want to trace 
// ...

performance.mark("measurementStop");
performance.measure("customTraceName", "measurementStart", "measurementStop");

Web version 8

const performance = window.performance;

performance.mark("measurementStart");

// Code that you want to trace 
// ...

performance.mark("measurementStop");
performance.measure("customTraceName", "measurementStart", "measurementStop");

Tenga en cuenta que el performance en el ejemplo anterior se refiere al objeto window.performance del navegador.

Cuando se usa la API de sincronización del usuario, las métricas y los atributos personalizados no se pueden agregar a los seguimientos de código personalizados. Utilice la API de seguimiento de supervisión de rendimiento si desea agregar esos elementos personalizados a un seguimiento de código personalizado.

Agregar métricas personalizadas a seguimientos de código personalizados

Utilice la API de seguimiento de supervisión de rendimiento para agregar métricas personalizadas a los seguimientos de código personalizados.

Tenga en cuenta lo siguiente:

  • Los nombres de las métricas personalizadas deben cumplir los siguientes requisitos: sin espacios en blanco iniciales ni finales, sin caracteres de subrayado ( _ ) iniciales y una longitud máxima de 100 caracteres.
  • Cada seguimiento de código personalizado puede registrar hasta 32 métricas (incluida la métrica de duración predeterminada).

Para agregar una métrica personalizada, agregue una línea de código similar a la siguiente cada vez que ocurra el evento. Por ejemplo, esta métrica personalizada cuenta los eventos relacionados con el rendimiento que ocurren en su aplicación.

Web version 9

import { trace } from "firebase/performance";

async function getInventory(inventoryIds) {
  const t = trace(perf, "inventoryRetrieval");

  // Tracks the number of IDs fetched (the metric could help you to optimize in the future)
  t.incrementMetric("numberOfIds", inventoryIds.length);

  // Measures the time it takes to request inventory based on the amount of inventory
  t.start();
  const inventoryData = await retrieveInventory(inventoryIds);
  t.stop();

  return inventoryData;
}

Web version 8

async function getInventory(inventoryIds) {
  const trace = perf.trace("inventoryRetrieval");

  // Tracks the number of IDs fetched (the metric could help you to optimize in the future)
  trace.incrementMetric("numberOfIds", inventoryIds.length);

  // Measures the time it takes to request inventory based on the amount of inventory
  trace.start();
  const inventoryData = await retrieveInventory(inventoryIds);
  trace.stop();

  return inventoryData;
}

Crear atributos personalizados para seguimientos de código personalizados

Utilice la API de seguimiento de supervisión de rendimiento para agregar atributos personalizados a los seguimientos de código personalizados.

Para usar atributos personalizados, agregue código a su aplicación que defina el atributo y lo asocie con un seguimiento de código personalizado específico. Puede establecer el atributo personalizado en cualquier momento entre el inicio y la finalización del seguimiento.

Tenga en cuenta lo siguiente:

  • Los nombres de los atributos personalizados deben cumplir los siguientes requisitos:

    • Sin espacios en blanco iniciales o finales, sin carácter de guión bajo inicial ( _ )
    • No hay espacios
    • La longitud máxima es de 32 caracteres
    • Los caracteres permitidos para el nombre son AZ , az y _ .
  • Cada seguimiento de código personalizado puede registrar hasta 5 atributos personalizados.

  • Asegúrese de que los atributos personalizados no contengan información que identifique personalmente a una persona ante Google.

    Más información sobre esta directriz

Web version 9

import { trace } from "firebase/performance";

const t = trace(perf, "test_trace");
t.putAttribute("experiment", "A");

// Update scenario
t.putAttribute("experiment", "B");

// Reading scenario
const experimentValue = t.getAttribute("experiment");

// Delete scenario
t.removeAttribute("experiment");

// Read attributes
const traceAttributes = t.getAttributes();

Web version 8

const trace = perf.trace("test_trace");
trace.putAttribute("experiment", "A");

// Update scenario
trace.putAttribute("experiment", "B");

// Reading scenario
const experimentValue = trace.getAttribute("experiment");

// Delete scenario
trace.removeAttribute("experiment");

// Read attributes
const traceAttributes = trace.getAttributes();

Seguimiento, visualización y filtrado de datos de rendimiento

Para ver los datos de rendimiento en tiempo real, asegúrese de que su aplicación utilice una versión del SDK de supervisión del rendimiento que sea compatible con el procesamiento de datos en tiempo real. Obtenga más información sobre los datos de rendimiento en tiempo real .

Seguimiento de métricas específicas en su tablero

Para conocer las tendencias de sus métricas clave, agréguelas a su tablero de métricas en la parte superior del panel de rendimiento . Puede identificar rápidamente las regresiones al ver los cambios semana tras semana o verificar que los cambios recientes en su código están mejorando el rendimiento.

una imagen del tablero de métricas en el panel de Firebase Performance Monitoring

Para agregar una métrica a su tablero de métricas, siga estos pasos:

  1. Vaya al panel de rendimiento en la consola de Firebase.
  2. Haga clic en una tarjeta de métrica vacía, luego seleccione una métrica existente para agregar a su tablero.
  3. Haga clic en en una tarjeta de métrica completa para obtener más opciones, por ejemplo, para reemplazar o eliminar una métrica.

El tablero de métricas muestra los datos métricos recopilados a lo largo del tiempo, tanto en forma gráfica como en forma de cambio de porcentaje numérico.

Obtenga más información sobre el uso del tablero .

Ver rastros y sus datos

Para ver sus seguimientos, vaya al panel de rendimiento en la consola de Firebase, desplácese hacia abajo hasta la tabla de seguimientos y luego haga clic en la subpestaña correspondiente. La tabla muestra algunas métricas principales para cada seguimiento, e incluso puede ordenar la lista por el cambio porcentual de una métrica específica.

Performance Monitoring proporciona una página de solución de problemas en Firebase console que resalta los cambios de métricas, lo que facilita abordar rápidamente y minimizar el impacto de los problemas de rendimiento en sus aplicaciones y usuarios. Puede usar la página de solución de problemas cuando se entera de posibles problemas de rendimiento, por ejemplo, en los siguientes escenarios:

  • Selecciona métricas relevantes en el tablero y nota un gran delta.
  • En la tabla de seguimientos, ordena para mostrar los deltas más grandes en la parte superior y ve un cambio porcentual significativo.
  • Recibe una alerta por correo electrónico que le notifica un problema de rendimiento.

Puede acceder a la página de solución de problemas de las siguientes maneras:

  • En el panel de métricas, haga clic en el botón Ver detalles de métricas .
  • En cualquier tarjeta de métrica, seleccione => Ver detalles . La página de solución de problemas muestra información sobre la métrica que seleccionó.
  • En la tabla de seguimientos, haga clic en un nombre de seguimiento o cualquier valor de métrica en la fila asociada con ese seguimiento.
  • En una alerta por correo electrónico, haga clic en Investigar ahora .

Cuando hace clic en un nombre de rastreo en la tabla de rastreos, puede profundizar en las métricas de interés. Haga clic en el botón filtro para filtrar los datos por atributo, por ejemplo:

una imagen de los datos de Firebase Performance Monitoring filtrados por atributo
  • Filtre por URL de página para ver los datos de una página específica de su sitio
  • Filtre por Tipo de conexión efectiva para saber cómo una conexión 3G afecta su aplicación
  • Filtre por país para asegurarse de que la ubicación de su base de datos no afecte a una región específica

Obtenga más información sobre cómo ver los datos de sus seguimientos .

Próximos pasos

  • Obtenga más información sobre el uso de atributos para examinar los datos de rendimiento.

  • Obtén más información sobre cómo realizar un seguimiento de los problemas de rendimiento en Firebase console.

  • Configure alertas para los cambios de código que degradan el rendimiento de su aplicación. Por ejemplo, puede configurar una alerta de correo electrónico para su equipo si la duración de un seguimiento de código personalizado específico supera el umbral que usted establece.