Como o JavaScript gerencia memória e como vazamentos acontecem?

Question

Accepted Answer

JavaScript usa **coleta automática de lixo**. O coletor usa um algoritmo **mark-and-sweep**: começando das raízes (objeto global, a pilha de chamadas atual), marca tudo que é **alcançável**, depois libera tudo que é inalcançável. Você nunca `free()` manualmente — mas você *pode* acidentalmente manter referências vivas, causando vazamentos.

## As quatro fontes clássicas de vazamento

```js
// 1. Unbounded globals / caches that never shrink
window.cache = window.cache || {};
window.cache[id] = bigObject; // grows forever

// 2. Forgotten event listeners
el.addEventListener("click", handler);
// must call el.removeEventListener("click", handler) when done

// 3. Forgotten timers
const id = setInterval(tick, 1000);
// must clearInterval(id)

// 4. Closures capturing large objects longer than needed
function outer() {
  const huge = new Array(1e6);
  return () => huge.length; // keeps `huge` alive as long as the closure lives
}
```

Uma referência de qualquer lugar alcançável (um global, um listener ativo, um closure, um nó DOM desanexado ainda referenciado em JS) impede que um objeto seja coletado.

## Diagnosticando vazamentos

```js
performance.memory; // rough heap size (Chrome)
// Chrome DevTools → Memory → take heap snapshots at two points and compare
```

Tire snapshots de heap antes/depois de uma ação; um "retained size" crescente constantemente revela o que não está sendo liberado.

## Ferramentas para evitar fixar objetos

```js
const meta = new WeakMap(); // keys are weakly held — GC can collect them
meta.set(domNode, data);    // doesn't prevent domNode from being garbage-collected
```

## Por que isso importa

Aplicações de longa duração (SPAs, servidores Node) travam ou ficam lentas devido a vazamentos.

Os reparos são limpeza disciplinada — remova listeners/timers, caches limitados (LRU), evite referências persistentes, e use `WeakMap`/`WeakSet` para metadados que não devem manter objetos vivos.