Medição do desempenho

Os aplicativos que desejam medir o desempenho dos fluxos de autenticação no MSAL.js podem fazer isso manualmente ou consumir as medidas de desempenho tomadas pela própria biblioteca. Para consumir medições de desempenho, é necessário configurar o cliente de desempenho nas opções de configuração de telemetria e adicionar um callback de desempenho.

Definir o cliente de desempenho de telemetria

import { PublicClientApplication, BrowserPerformanceClient } from "@azure/msal-browser";

const msalConfig = {
    auth: {
        ...
    },
    cache: {
        ...
    },
    system: {
        ...
    }
}

const msalInstance = new PublicClientApplication({
    ...msalConfig,
    telemetry: {
        client: new BrowserPerformanceClient(msalConfig)
    }
});
msalInstance.initialize();

Adicionar retorno de chamada de desempenho

Os aplicativos podem registrar uma função de callback para receber medições de desempenho realizadas pela biblioteca. Essas medidas incluirão medidas de ponta a ponta para APIs de nível superior, bem como medidas para APIs internas importantes.

Observação para aplicativos proprietários da MSFT: publicaremos um build interno de @azure/msal-browser já instrumentado para capturar essa telemetria. Entre em contato conosco para obter mais detalhes.

Example

const msalInstance = new PublicClientApplication(config);

msalInstance.addPerformanceCallback((events: PerformanceEvent[]) => {
    events.forEach(event => {
        console.log(event);
    });
});

Evento de exemplo:

const event: PerformanceEvent = {
    correlationId: "aaaa0000-bb11-2222-33cc-444444dddddd",
	durationMs: 1873,
	endPageVisibility: "hidden",
	fromCache: false,
	name: "acquireTokenSilent",
	startPageVisibility: "visible",
	startTimeMs: 1636414041888,
	success: true,
    silentCacheClientAcquireTokenDurationMs: 0,
    silentRefreshClientAcquireTokenDurationMs: 150,
    silentIframeClientAcquireTokenDurationMs: 0
    cryptoOptsGetPublicKeyThumbprintDurationMs: 200,
    cryptoOptsSignJwtDurationMs: 8,
    clientId: "00001111-aaaa-2222-bbbb-3333cccc4444",
    authority: "https://login.microsoftonline.com/common",
    libraryName: "@azure/msal-browser-1p",
    libraryVersion: "5.0.0",
    appName: "my-application",
    appVersion: "1.0.0"
}

Os detalhes completos dos PerformanceEvents objetos podem ser encontrados aqui. Veja abaixo uma lista de algumas propriedades notáveis:

removePerformanceCallback

A API addPerformanceCallback retornará uma ID de callback, que um aplicativo pode passar para PublicClientApplication.removePerformanceCallback para cancelar o registro desse callback, para que ele deixe de receber eventos de desempenho. Ele retornará um booleano indicando se o callback foi removido com sucesso ou não.

Example

const msalInstance = new PublicClientApplication(config);

const callbackId: string = msalInstance.addPerformanceCallback((events: PerformanceEvent[]) => {
    events.forEach(event => {
        console.log(event);
    });
});

const removed: boolean = msalInstance.removePerformanceCallback(callbackId);

Medindo o desempenho do navegador

As medidas de desempenho do navegador são desabilitadas por padrão devido à sobrecarga de desempenho significativa imposta. Os aplicativos que desejam habilitar as medidas de desempenho relatadas à linha do tempo de desempenho do navegador devem:

1. Abrir ferramentas de desenvolvedor do navegador
   • Navegadores Edge, Chrome e Firefox: pressione F12
   • Safari: acesse as preferências do Safari (Safari Menu>Preferences), selecione Advanced Tab e habilite Show features for web developers. Depois que esse menu estiver habilitado, você encontrará o console do desenvolvedor clicando em Develop>Show Javascript Console
2. Navegue até Session Storage:
   • Edge
   • Chrome
   • Firefox
   • Safari: vá para a guia Storage e expanda Session Storage
3. Selecionar domínio de destino
4. Adicione a chave msal.browser.performance.enabled a Session Storage, defina seu valor como 1, atualize a página e verifique a linha do tempo de desempenho no navegador.