Compartilhar via


Partilhar rastreios de memória e desempenho melhorados

As ferramentas de Desempenho e Memória registam dados de runtime sobre a sua página Web. Explorar os dados registados permite melhorar a utilização da memória ou o desempenho do runtime da sua página Web.

Além disso, os dados registados podem ser exportados para ficheiros no disco. Os ficheiros exportados são denominados rastreios.

Exportar rastreios de desempenho e memória é útil quando quer partilhar estes ficheiros com outras pessoas para obter ajuda para investigar problemas. Um rastreio exportado é um .jsonficheiro , .heapsnapshot, .heapprofileou .heaptimeline que pode ser importado em DevTools em qualquer altura.

Por predefinição, os rastreios contêm informações mínimas sobre os dados de runtime da página Web rastreada, mas os rastreios também podem ser exportados como rastreios melhorados, como uma funcionalidade experimental. Um rastreio melhorado é um .devtools ficheiro que contém muito mais dados de runtime da página Web rastreada. Os rastreios melhorados facilitam a resolve problemas de desempenho e memória, recriando o ambiente no qual o rastreio foi gravado e fornecendo ficheiros de origem originais.

A utilização de rastreios melhorados permite resolve de forma fiável referências de código fonte encontradas em rastreios importados para o código de runtime real na ferramenta Origens. Além disso, se os mapas de origem estiverem presentes quando um rastreio foi registado ou se estiverem armazenados no Servidor de Símbolos dos Artefactos do Azure, também será possível resolve referências de código ao respetivo código fonte original.

Diferenças entre rastreios normais e melhorados

Rastreios normais

Um rastreio normal contém apenas algumas das informações que estão presentes numa página Web. Grande parte do código original é perdido e apenas os dados de desempenho ou memória registados da página Web são preservados no rastreio. Por exemplo, ao importar um .heapsnapshot rastreio de memória que foi gravado durante outra sessão de DevTools ou noutro computador, não há forma de passar de um objeto na ferramenta Memória para o respetivo construtor na ferramenta Origens .

Da mesma forma, na ferramenta Desempenho , quando importa um rastreio de desempenho registado anteriormente:

  • O rastreio tem de ter sido registado no mesmo site e na mesma configuração para poder mapear do relatório de desempenho para o JavaScript que estava em execução no browser.
  • Se os nomes de ficheiros ou funções tiverem sido alterados desde que a gravação foi tirada, o mapeamento é propenso a erros.

Rastreios melhorados

Um rastreio melhorado retém muito mais informações sobre a página Web onde a gravação ocorreu. Por exemplo, um rastreio melhorado contém o contexto de execução e a lista de scripts analisados e, opcionalmente, pode conter mensagens de consola, origens de script e uma snapshot da árvore DOM.

Quando um rastreio melhorado é importado em DevTools, é apresentada uma nova janela DevTools. Esta nova janela não está ligada à página Web que está a ser executada no browser e, em vez disso, recria parte do ambiente no qual o rastreio foi originalmente gravado.

Por exemplo, se um snapshot do DOM tiver sido registado no rastreio melhorado, a ferramenta Elementos apresenta esta snapshot. Se as mensagens da consola foram gravadas, a ferramenta Consola imprime estas mensagens. A ferramenta Origens apresenta os scripts que estavam presentes durante a gravação.

Os rastreios melhorados só podem ser importados no Microsoft Edge, enquanto os rastreios normais são compatíveis com outros browsers com base no motor Chromium.

Definir o tipo de rastreio predefinido

Por predefinição, as ferramentas de Desempenho e Memória exportam dados como rastreios normais, mas pode definir o tipo de rastreio predefinido como enhanced.

Para alterar o tipo de rastreio:

  1. Abra As DevTools ao premir Ctrl+Shift+I (Windows, Linux) ou Comando+Opção+I (macOS).

  2. Em DevTools, no canto superior direito, clique em Definições (botão Definições). As definições são abertas, com a página Preferências selecionada.

  3. Na secção Persistência da página Preferências , selecione a caixa de verificação Exportar desempenho melhorado e rastreios de memória :

    O painel Definições em DevTools, com a opção de rastreios melhorados selecionada

  4. Opcionalmente, os rastreios melhorados também podem incluir mensagens da consola, origens de scripts e elementos DOM. Para controlar o que incluir em rastreios melhorados, utilize estas caixas de verificação:

    • Inclua a mensagem da consola em rastreios melhorados.
    • Inclua origens de script em rastreios melhorados.
    • Inclua instantâneos DOM em rastreios melhorados (experimentais).

    O painel Definições em DevTools, a mostrar as outras opções de rastreio melhoradas

Exportar um rastreio da ferramenta Desempenho

Para exportar uma gravação de desempenho a partir da Ferramenta de desempenho :

  1. Abra a ferramenta Desempenho .

  2. Clique em Gravar e execute o cenário do qual pretende investigar o desempenho ao interagir com a página Web e, em seguida, clique em Parar.

  3. Quando o perfil de desempenho for apresentado, clique em Guardar perfil (botão Guardar perfil):

    Microsoft Edge com DevTools, a mostrar a ferramenta Desempenho, com o botão Guardar perfil

  4. Escolha uma localização para guardar o ficheiro de rastreio no disco:

    A caixa de diálogo Guardar do Windows a mostrar o ficheiro de rastreio de desempenho a ser guardado numa pasta de rastreios

    O rastreio é um .json ficheiro se definir o tipo de rastreio predefinido como normal e for um .devtools ficheiro se definir o tipo de rastreio predefinido como melhorado.

Exportar um rastreio da ferramenta Memória

Para exportar informações de memória da ferramenta Memória :

  1. Abra a ferramenta Memória .

  2. Escolha o tipo de gravação de memória em que está interessado, como Instantâneo da Área Dinâmica para Dados. As instruções seguintes são semelhantes se escolher um tipo de gravação de memória diferente. Para saber mais sobre os diferentes tipos de gravação de memória, veja Corrigir problemas de memória.

  3. Clique em Tirar Instantâneo.

  4. Quando a snapshot for gravada, clique no botão Guardar na barra lateral da ferramenta Memória:

    Microsoft Edge com DevTools a mostrar a ferramenta Memória, com o botão Guardar

  5. Escolha uma localização para guardar o ficheiro de rastreio no disco:

    A caixa de diálogo Guardar do Windows, que mostra o ficheiro de rastreio de memória a ser guardado numa pasta de rastreios

    O rastreio é um .heapsnapshotficheiro , .heapprofileou .heaptimeline se definir o tipo de rastreio predefinido como normal e é um .devtools ficheiro se definir o tipo de rastreio predefinido como melhorado.

Escolher um tipo de rastreio ao exportar

Os rastreios são exportados como rastreios normais ou melhorados, consoante a opção Exportar Desempenho Melhorado e Rastreios de Memória . Para alterar o tipo de rastreio predefinido, consulte Definir o tipo de rastreio predefinido. Também pode escolher o tipo de rastreio que pretende ao exportar.

Para escolher um tipo de rastreio diferente ao exportar:

  1. Clique com o botão direito do rato (ou mantenha premida a tecla Ctrl e clique) no perfil Guardar (botão Guardar perfil) na ferramenta Desempenho ou no botão Guardar na ferramenta Memória .

  2. Clique em .devtools (formato melhorado para o Microsoft Edge) se quiser exportar um rastreio melhorado ou clique em .json (funciona com o Microsoft Edge e Chromium browsers) se quiser um rastreio normal.

    O menu de contexto no botão Guardar Perfil na ferramenta Desempenho, para selecionar o tipo de rastreio

Importar um rastreio na Ferramenta de desempenho

Para importar um rastreio na Ferramenta de desempenho :

  1. Abra a ferramenta Desempenho .

  2. Clique em Carregar perfil (botão Carregar perfil):

    Microsoft Edge, a mostrar a Ferramenta de desempenho em DevTools, com o botão Carregar perfil

  3. Localize o ficheiro de rastreio no disco. É um .devtools ficheiro (para rastreios melhorados) ou um .json ficheiro (para rastreios normais):

    A caixa de diálogo Abrir do Windows, a mostrar um ficheiro de rastreio de desempenho

  4. Abra o ficheiro.

    Se o ficheiro for um rastreio melhorado, é apresentada uma nova janela DevTools, que mostra o perfil de desempenho e as informações de runtime extra que foram gravadas nas ferramentas Origens, Consola e Elementos .

    Se o ficheiro for um rastreio normal, o perfil de desempenho é apresentado na ferramenta Desempenho e os restantes separadores DevTools continuam a mostrar informações relacionadas com a página Web atual.

Importar um rastreio na ferramenta Memória

Para importar um rastreio na ferramenta Memória :

  1. Abra a ferramenta Memória .

  2. Clique no botão Carregar perfil :

    Microsoft Edge, a mostrar a ferramenta Memória em DevTools, com o botão Carregar

  3. Localize o ficheiro de rastreio no disco. É um .devtools ficheiro (para rastreios melhorados) ou um .heapsnapshotficheiro , .heaptimelineou .heapprofile (para rastreios normais).

    A caixa de diálogo Abrir do Windows, a mostrar um ficheiro de rastreio de memória

  4. Abra o ficheiro.

    Se o ficheiro for um rastreio melhorado, é apresentada uma nova janela DevTools, que mostra as informações de memória e as informações de runtime extra que foram gravadas nas ferramentas Origens, Consola e Elementos .

    Se o ficheiro for um rastreio normal, as informações de memória são apresentadas na ferramenta Memória e os restantes separadores DevTools continuam a mostrar informações relacionadas com a página Web atual.

Partilhar feedback sobre rastreios melhorados

Os rastreios melhorados são uma funcionalidade experimental que, com sorte, facilita a colaboração na resolução de problemas de desempenho e memória ao ver código não identificado.

A equipa de DevTools do Microsoft Edge saúda todos os comentários que possa ter sobre rastreios melhorados. Se experimentou esta nova funcionalidade, não hesite em comunicar quaisquer problemas ou ideias sobre a mesma no nosso repositório do GitHub.