Aggiungi monitoraggio personalizzato per codice app specifico

Il monitoraggio delle prestazioni raccoglie tracce per aiutarti a monitorare le prestazioni della tua app. Una traccia è un rapporto di dati sulle prestazioni acquisiti tra due punti nel tempo nella tua app.

Puoi creare le tue tracce per monitorare i dati sulle prestazioni associati a codice specifico nella tua app. Con una traccia del codice personalizzata , puoi misurare quanto tempo impiega la tua app per completare un'attività specifica o una serie di attività, ad esempio il caricamento di una serie di immagini o l'esecuzione di query sul database.

La metrica predefinita per una traccia di codice personalizzata è la sua "durata" (il tempo che intercorre tra il punto iniziale e quello di arresto della traccia), ma puoi anche aggiungere metriche personalizzate .

Nel tuo codice, definisci l'inizio e la fine di una traccia del codice personalizzato utilizzando le API fornite da Performance Monitoring SDK.Le tracce del codice personalizzato possono essere avviate in qualsiasi momento dopo la creazione e sono thread-safe.

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

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

Attributi predefiniti, attributi personalizzati e metriche personalizzate

È inoltre possibile configurare una traccia del codice personalizzata per registrare le metriche personalizzate per gli eventi relativi alle prestazioni che si verificano nell'ambito della traccia. Ad esempio, puoi creare una metrica personalizzata per il numero di riscontri nella cache o per il numero di volte in cui l'interfaccia utente non risponde per un periodo di tempo notevole.

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

Aggiungi tracce di codice personalizzate

Utilizzare l' API Performance Monitoring Trace per aggiungere tracce di codice personalizzate per monitorare il codice dell'applicazione specifica.

Notare quanto segue:

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

Per avviare e arrestare una traccia del codice personalizzato, racchiudi il codice che desideri tracciare 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'API Performance Monitoring Trace, puoi aggiungere tracce di codice personalizzate utilizzando l' API User Timing nativa del browser. La durata di una traccia misurata utilizzando questa API viene rilevata automaticamente dall'SDK di monitoraggio delle prestazioni. L'utilizzo dell'API User Timing è particolarmente utile se preferisci caricare l'SDK di monitoraggio delle prestazioni in modo asincrono. Una volta che l'SDK è stato inizializzato, l'SDK registrerà le misurazioni effettuate prima del suo caricamento.

Per utilizzare questa funzione, avvolgi il codice che desideri tracciare con i contrassegni User Timing:

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

Si noti che performance nell'esempio precedente si riferiscono all'oggetto window.performance del browser.

Quando si utilizza l'API User Timing, le metriche e gli attributi personalizzati non possono essere aggiunti alle tracce del codice personalizzato. Utilizzare l' API Performance Monitoring Trace se si desidera aggiungere tali elementi personalizzati a una traccia di codice personalizzata.

Aggiungi metriche personalizzate alle tracce di codice personalizzate

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

Notare quanto segue:

• I nomi per le metriche personalizzate devono soddisfare i seguenti requisiti: nessuno spazio bianco iniziale o finale, nessun carattere di sottolineatura iniziale ( _ ) e la lunghezza massima è di 100 caratteri.
• Ogni traccia di codice personalizzato può registrare fino a 32 metriche (inclusa la metrica Durata predefinita).

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 conta gli eventi relativi alle prestazioni 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

Crea attributi personalizzati per tracce di codice personalizzate

Utilizzare l' API Performance Monitoring Trace per aggiungere attributi personalizzati alle tracce di codice personalizzate.

Per utilizzare gli attributi personalizzati, aggiungi il codice alla tua app che definisce l'attributo e lo associa a una specifica traccia del codice personalizzato. È possibile impostare l'attributo personalizzato in qualsiasi momento tra l'avvio e l'arresto della traccia.

Notare quanto segue:

• I nomi per gli attributi personalizzati devono soddisfare i seguenti requisiti:

  • Nessuno spazio bianco iniziale o finale, nessun carattere di sottolineatura iniziale ( _ ).
  • No spazi
  • La lunghezza massima è di 32 caratteri
  • I caratteri consentiti per il nome sono AZ , az e _ .

• Ogni traccia di codice personalizzato può registrare fino a 5 attributi personalizzati.

• Assicurati che gli attributi personalizzati non contengano informazioni che identificano personalmente un individuo per Google.

  Ulteriori informazioni su questa linea 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

Tieni traccia, visualizza e filtra i dati sulle prestazioni

Per visualizzare i dati sulle prestazioni in tempo reale, assicurati che la tua app utilizzi una versione dell'SDK di monitoraggio delle prestazioni compatibile con l'elaborazione dei dati in tempo reale. Ulteriori informazioni sui dati sulle prestazioni in tempo reale .

Tieni traccia di metriche specifiche nella tua dashboard

Per conoscere l'andamento delle tue metriche chiave, aggiungile alla scheda delle metriche nella parte superiore della dashboard Performance . Puoi identificare rapidamente le regressioni visualizzando le modifiche settimanali o verificare che le modifiche recenti nel tuo codice stiano migliorando le prestazioni.

Per aggiungere una metrica alla scheda delle metriche, procedi nel seguente modo:

1. Vai alla dashboard delle prestazioni nella console Firebase.
2. Fai clic su una scheda metrica vuota, quindi seleziona una metrica esistente da aggiungere alla scheda.
3. Fai clic su more_vert su una scheda metrica popolata per ulteriori opzioni, ad esempio per sostituire o rimuovere una metrica.

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

Ulteriori informazioni sull'utilizzo della dashboard .

Visualizza le tracce e i relativi dati

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

Il monitoraggio delle prestazioni fornisce una pagina di risoluzione dei problemi nella console Firebase che evidenzia le modifiche alle metriche, semplificando la gestione rapida e riducendo al minimo l'impatto dei problemi di prestazioni su app e utenti. Puoi utilizzare la pagina di risoluzione dei problemi quando vieni a conoscenza di potenziali problemi di prestazioni, ad esempio nei seguenti scenari:

• Selezioni le metriche pertinenti sulla dashboard e noti un grande delta.
• Nella tabella delle tracce si ordina per visualizzare i delta maggiori in alto e si vede una variazione percentuale significativa.
• Ricevi un avviso e-mail che ti informa di un problema di prestazioni.

È possibile accedere alla pagina di risoluzione dei problemi nei seguenti modi:

• Nella dashboard delle metriche, fai clic sul pulsante Visualizza dettagli metrica .
• Su qualsiasi scheda metrica, seleziona more_vert => Visualizza dettagli . La pagina di risoluzione dei problemi mostra informazioni sulla metrica selezionata.
• Nella tabella delle tracce, fare clic su un nome di traccia o su qualsiasi valore di metrica nella riga associata a tale traccia.
• In un avviso email, fai clic su Esamina ora .

Quando si fa clic sul nome di una traccia nella tabella delle tracce, è quindi possibile visualizzare in dettaglio le metriche di interesse. Fare clic sul pulsante add filtro per filtrare i dati per attributo, ad esempio:

• Filtra per URL pagina per visualizzare i dati per una pagina specifica del tuo sito
• Filtra per Tipo di connessione efficace per scoprire in che modo una connessione 3G influisce sulla tua app
• Filtra per Paese per assicurarti che la posizione del tuo database non riguardi una regione specifica

Scopri di più sulla visualizzazione dei dati per le tue tracce .

Prossimi passi

• Ulteriori informazioni sull'utilizzo degli attributi per esaminare i dati sulle prestazioni.

• Ulteriori informazioni su come tenere traccia dei problemi di prestazioni nella console Firebase.

• Imposta avvisi per le modifiche al codice che riducono le prestazioni della tua app. Ad esempio, puoi configurare un avviso e-mail per il tuo team se la durata di una specifica traccia di codice personalizzato supera una soglia impostata.