Aggiungere il monitoraggio personalizzato per un codice dell'app specifico

Performance Monitoring raccoglie le tracce per aiutarti a monitorare il rendimento della tua app. Una traccia è un report dei dati sul rendimento acquisiti tra due istanti della tua app.

Puoi creare le tue tracce per monitorare i dati sul rendimento associati a codice specifico nella tua app. Con una traccia di codice personalizzata, puoi misurare il tempo necessario alla tua app per completare un'attività specifica o un insieme di attività, ad esempio il caricamento di un insieme di immagini o l'esecuzione di query sul database.

La metrica predefinita per una traccia di codice personalizzata è la "durata" (il tempo tra i punti di inizio e di arresto della traccia), ma puoi anche aggiungere metriche personalizzate.

Nel codice, definisci l'inizio e la fine di una traccia di codice personalizzata utilizzando le API fornite dall'SDK Performance Monitoring. Dopo la creazione, le tracce di codice personalizzate possono essere avviate in qualsiasi momento sono sicuri per i thread.

Poiché la metrica predefinita raccolta per queste tracce è "durata", vengono chiamata a volte "Tracce durata".

Puoi visualizzare i dati di queste tracce nella sottoscheda Tracce personalizzate della tabella delle tracce, che si trova nella parte inferiore della dashboard Rendimento (scopri di più sull'utilizzo della console più avanti in questa pagina).

Attributi predefiniti, attributi personalizzati e metriche personalizzate

Puoi configurare ulteriormente una traccia di codice personalizzata metriche personalizzate per eventi correlati al rendimento che che si verifichino nell'ambito della traccia. Ad esempio, puoi creare una metrica personalizzata per il numero di hit e fallimenti della cache o il numero di volte in cui l'interfaccia utente non risponde per un periodo di tempo notevole.

Gli attributi e le metriche personalizzate vengono visualizzati nella console Firebase insieme agli attributi e alla metrica predefiniti per la traccia.

Aggiungi tracce di codice personalizzate

Utilizza l'Performance Monitoring API Trace per aggiungere tracce di codice personalizzate per monitorare un codice dell'applicazione specifico.

Tieni presente quanto segue:

• Un'app può avere più tracce di codice personalizzate.
• È possibile eseguire più tracce di codice personalizzate contemporaneamente.
• I nomi delle tracce di codice personalizzate devono soddisfare i seguenti requisiti: nessun carattere di spazio iniziale o finale, nessun carattere iniziale di trattino basso (_) e la lunghezza massima è di 100 caratteri.
• Le tracce di codice personalizzate supportano l'aggiunta di metriche personalizzate e attributi personalizzati.

Per avviare e interrompere una traccia di codice personalizzato, racchiudi il codice da monitorare con righe di codice simili alle seguenti:

import { trace } from "firebase/performance";

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

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

t.stop();
perf_add_custom_trace.js

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

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

trace.stop();
index.js

Aggiungi tracce di codice personalizzate utilizzando l'API User Timing

Oltre all'Performance MonitoringAPI Trace, puoi aggiungere tracce di codice personalizzato utilizzando l'API User Timing nativa di un browser. La durata di una traccia misurata utilizzando questa API viene automaticamente rilevata dal SDK Performance Monitoring. L'utilizzo dell'API User Timing è particolarmente utile se preferisci per caricare l'SDK Performance Monitoring in modo asincrono. Una volta inizializzato, l'SDK registrerà le misurazioni eseguite prima del caricamento.

Per utilizzare questa funzionalità, racchiudi il codice da tracciare con gli indicatori di temporizzazione utente:

const performance = window.performance;

performance.mark("measurementStart");

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

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

const performance = window.performance;

performance.mark("measurementStart");

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

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

Tieni presente che performance nell'esempio precedente si riferisce alla configurazione Oggetto window.performance.

Quando si utilizza l'API User Timing, le metriche e gli attributi personalizzati non possono essere aggiunti a le tracce del codice personalizzate. Utilizza la API Performance Monitoring Trace se vuoi aggiungere queste API personalizzate a una traccia di codice personalizzata.

Aggiungi metriche personalizzate alle tracce di codice personalizzate

Utilizza l'Performance Monitoring API Trace per aggiungere metriche personalizzate alle tracce di codice personalizzate.

Tieni presente quanto segue:

• I nomi delle metriche personalizzate devono soddisfare i seguenti requisiti: Nessuno spazio vuoto iniziale o finale, nessun carattere di sottolineatura iniziale (_) e la lunghezza massima è di 100 caratteri.
• Ogni traccia di codice personalizzata può registrare fino a 32 metriche (tra cui quella predefinita Durata).

Per aggiungere una metrica personalizzata, aggiungi una riga di codice simile alla seguente ogni volta che si verifica l'evento. Ad esempio, questa metrica personalizzata conteggia relativi al rendimento che si verificano nella tua app.

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;
}
perf_add_custom_metrics.js

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;
}
index.js

Creare attributi personalizzati per le tracce di codice personalizzate

Utilizza l'Performance Monitoring API Trace per aggiungere attributi personalizzati alle tracce di codice personalizzato.

Per utilizzare gli attributi personalizzati, aggiungi alla tua app codice che definisce l'attributo e lo associa a una traccia di codice personalizzata specifica. Puoi impostare l'attributo personalizzato in qualsiasi momento tra l'inizio e la fine della traccia.

Tieni presente quanto segue:

• I nomi degli attributi personalizzati devono soddisfare i seguenti requisiti:

  • Nessuno spazio vuoto iniziale o finale, nessun carattere di sottolineatura iniziale (_)
  • Nessuno spazio
  • La lunghezza massima è di 32 caratteri
  • I caratteri consentiti per il nome sono A-Z, a-z e _.

• Ogni traccia di codice personalizzata può registrare fino a cinque attributi personalizzati.

• Assicurati che gli attributi personalizzati non contengano informazioni che consentono l'identificazione personale di un individuo per Google.

  Scopri di più su queste linee guida

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();
perf_add_custom_attributes.js

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();
index.js

Monitorare, visualizzare e filtrare i dati sul rendimento

Per visualizzare i dati sul rendimento in tempo reale, assicurati che la tua app utilizzi un Versione dell'SDK di monitoraggio compatibile con l'elaborazione dati in tempo reale. Scopri di più sui dati sul rendimento in tempo reale.

Monitoraggio di metriche specifiche nella dashboard

Per conoscere l'andamento delle tue metriche chiave, aggiungile alla bacheca delle metriche nella parte superiore della Dashboard sul rendimento. Puoi identificare rapidamente le regressioni monitorando le variazioni di settimana in settimana o verificare che le modifiche recenti al codice stiano migliorando il rendimento.

Per aggiungere una metrica alla scheda delle metriche:

1. Vai alla dashboard Rendimentonella console Firebase.
2. Fai clic su una scheda di una metrica vuota, poi seleziona una metrica esistente da aggiungere alla scheda.
3. Clic more_vert in una scheda delle metriche compilata per visualizzare altre opzioni, ad esempio per sostituire o rimuovere una metrica.

La scheda delle metriche mostra i dati delle metriche raccolti nel tempo, sia in forma grafica sia come variazione percentuale numerica.

Scopri di più sull'utilizzo della dashboard.

Visualizza le tracce e i relativi dati

Per visualizzare le tracce, vai alla dashboard Rendimento nella console Firebase, scorri verso il basso fino alla tabella delle tracce e fai clic sulla sottoscheda appropriata. La tabella mostra alcune metriche principali per ogni traccia e puoi anche ordinare l'elenco in base alla variazione percentuale di una metrica specifica.

Performance Monitoring fornisce una pagina di risoluzione dei problemi nella console Firebase che evidenzia la metrica che consentono di risolvere rapidamente i problemi di rendimento e di minimizzare l'impatto di app e utenti. Puoi usare la pagina di risoluzione dei problemi quando trovi potenziali problemi di prestazioni, ad esempio, nei seguenti scenari:

• Selezioni metriche pertinenti nella dashboard e noti un grande delta.
• Nella tabella delle tracce, ordina in modo da visualizzare i delta più grandi in alto e vedrai un una variazione percentuale significativa.
• Ricevi un avviso via email che ti informa di un problema di rendimento.

Puoi accedere alla pagina di risoluzione dei problemi nei seguenti modi:

• Nella dashboard delle metriche, fai clic sul pulsante Visualizza i dettagli della metrica.
• In qualsiasi scheda delle metriche, seleziona more_vert => Visualizza dettagli La pagina di risoluzione dei problemi mostra informazioni sulla metrica che hai selezionato.
• Nella tabella delle tracce, fai clic sul nome di una traccia o su un valore della metrica nella riga associata alla traccia.
• In un avviso via email, fai clic su Esegui accertamenti ora.

Quando fai clic sul nome di una traccia nella tabella delle tracce, puoi visualizzare in dettaglio le metriche di interesse. Fai clic sull' Pulsante Filtraadd per filtrare i dati per attributo, ad esempio:

• Filtra in base a URL pagina per visualizzare i dati relativi a una pagina specifica del tuo sito
• Filtra per Tipo di connessione effettivo per scoprire come una connessione 3G influisce sulla tua app
• Filtra per Paese per assicurarti che la località del database non influisca su un valore specifico regione

Scopri di più su la visualizzazione di dati per le tue tracce.

Passaggi successivi

• Scopri di più su utilizzando attributi per esaminare i dati sul rendimento.

• Scopri di più su come monitorare i problemi di prestazioni in Console Firebase.

• Configura avvisi per le modifiche al codice in fase di riduzione il rendimento della tua app. Ad esempio, puoi configurare un avviso via email per il tuo team se la durata di una traccia di codice personalizzato specifica supera una soglia che hai impostato.