Como usar a ferramenta do criador de perfil de alocação

Meggin Kearney
Meggin Kearney

Use a ferramenta do criador de perfil de alocação para encontrar objetos que não estão sendo coletados da lixeira corretamente e continuar retendo memória.

Como a ferramenta funciona

O criador de perfil de alocação combina as informações detalhadas do snapshot do criador de perfil de alocação heap com a atualização e o rastreamento incrementais do painel Linha do tempo. De forma semelhante a essas ferramentas, o rastreamento da alocação de heap dos objetos envolve iniciar uma gravação, executar uma sequência de ações e, em seguida, interromper a gravação para análise.

A ferramenta gera snapshots de heap periodicamente durante a gravação (a cada 50 ms) e um snapshot final ao final da gravação.

Criador de perfil de alocação

Ativar criador de perfil de alocação

Para começar a usar o criador de perfil de alocação:

  1. Confira se você tem a versão mais recente do Chrome Canary.
  2. Abra as Ferramentas para desenvolvedores e clique no ícone de engrenagem no canto inferior direito.
  3. Agora, abra o painel do Profiler. Você verá um perfil chamado "Record Heap Allocations".

Criador de perfil de alocação de heap

Ler um perfil de alocação de heap

O perfil de alocação de heap mostra onde os objetos estão sendo criados e identifica o caminho de retenção. No instantâneo abaixo, as barras na parte superior indicam quando novos objetos são encontrados na pilha.

A altura de cada barra corresponde ao tamanho dos objetos alocados recentemente, e a cor das barras indica se esses objetos ainda estão ativos ou não no snapshot de heap final. As barras azuis indicam objetos que ainda estão ativos no final da linha do tempo. As barras cinza indicam objetos que foram alocados durante a linha do tempo, mas que desde então foram coletados:

Snapshot do criador de perfil de alocação

No resumo abaixo, uma ação foi realizada 10 vezes. O programa de exemplo armazena em cache cinco objetos, de modo que as últimas cinco barras azuis são esperadas. Mas a barra azul mais à esquerda indica um possível problema.

É possível usar os controles deslizantes na linha do tempo acima para aumentar o zoom nesse snapshot específico e ver os objetos alocados recentemente naquele ponto:

Aumentar o zoom no snapshot

Clicar em um objeto específico no heap mostrará a árvore de retenção na parte inferior do snapshot do heap. Ao examinar o caminho de retenção do objeto, você terá informações suficientes para entender por que o objeto não foi coletado. Assim, é possível fazer as alterações necessárias no código para remover a referência desnecessária.

Ver a alocação de memória por função

Também é possível ver a alocação de memória por função JavaScript. Consulte Investigar a alocação de memória por função para mais informações.