Executando verificação de segurança...
2

[ Dúvida ] Como debugar vazamento de memória no navegador?

Introdução:

Chegou a hora de aprender mais a fundo sobre gerenciamente de memória, e então conheci (já sabia que existia, mas não profundamente) sobre o Garbage Collector, WeakMap() e WeakSet(), dentre outros detalhes.

Problemas para entender gerenciamente de memória:

Eu compreendo, ao menos o básico sobre o assunto. Sei que um vazamento de memória, é aquele valor alocado mesmo sem estar sendo utilizado, consequentemente reduzindo a performance da aplicação.

Dito isso, sei que o Garbage Collector coleta tudo aquilo que já não é mais "usado", quando esse valor já não é mais referenciado em nenhuma parte de sua aplicação, sendo mais técnico, esse valores não utilizados são representados pelo com 0 e todos os 0 são removidos da memória.

Até ai, tudo bem... Porém, apesar de entender isso, não tenho a certeza de como rastrear precisamente um vazamento de memória. Tenho aqui o print de uma aplicação minha que fiz a bastante tempo, onde uso para testes e verificar se tem ou não vazamantos de memória:

illustation

Eu sei que a cor cinza é para a memória que foi utilizada em algum momento, e logo após liberada, e a azul, a memória ativa.

O que eu não entendo muito bem, é essa diferença durante esse curto periodo de uso da aplicação. Eu realizei a mesma ação 3 vezes e parei o monitoramente.

Começa baixo, aumenta bruscamente, depois baixa e logo em seguida aumenta ainda mais... Não consigo inferir se isso é bom ou ruim, e se é comum, até porque eu fiz a mesma ação 3 vezes, e os resultados difere bastante.

Existe algum macete ou tópico que eu posso ler/saber para eu conseguir rastrear vazamentos de memória de forma precisa?

Carregando publicação patrocinada...