Como usar a ferramenta de linha do tempo de alocação

Meggin Kearney

Use a ferramenta Cronologia de alocação para encontrar objetos que não estão sendo coletados corretamente e continuam retendo memória.

Como a ferramenta funciona

Um relatório de linha do tempo de alocação combina as informações detalhadas do snapshot do analista de heap com a atualização incremental e o rastreamento do painel de linha do tempo. Assim como essas ferramentas, o rastreamento da alocação de heap envolve iniciar uma gravação, realizar uma sequência de ações e interromper a gravação para análise.

A ferramenta tira snapshots do heap periodicamente durante a gravação (a cada 50 ms!) e um snapshot final no final da gravação.

Observação:o número depois do @ é um ID de objeto que persiste entre vários snapshots feitos. Isso permite uma comparação precisa entre os estados de heap. Mostrar o endereço de um objeto não faz sentido, porque os objetos são movidos durante a coleta de lixo.

Gravar um relatório de linha do tempo de alocação

Para começar a usar a ferramenta Cronograma de alocação, siga estas etapas:

1. Abra o painel Memória no DevTools.
2. Ative o perfil Alocações na linha do tempo.
3. Pressione o botão Start para iniciar a gravação.

Ler um perfil de alocação de heap

O perfil de alocação de pilha mostra onde os objetos são criados e identifica o caminho de retenção. No exemplo a seguir, as barras na parte de cima 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 no snapshot final da pilha. As barras azuis indicam objetos que ainda estão ativos no final da linha do tempo. As barras cinzas indicam objetos que foram alocados durante a linha do tempo, mas foram coletados:

É possível aumentar o zoom para filtrar o painel Constructor e mostrar apenas os objetos alocados durante o período especificado. Para aumentar o zoom, arraste o mouse sobre o período que você quer focar na linha do tempo.

Clicar em um construtor específico no painel Constructor mostra a árvore de retenção no painel Retainers. O exame do caminho de retenção para o objeto deve fornecer informações suficientes para entender por que o objeto não foi coletado, e você pode fazer as mudanças necessárias no código para remover a referência desnecessária.

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

Também é possível conferir 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.