Come correggeresti una perdita di memoria nel tuo codice?

Identificheresti la fonte della perdita di memoria usando gli strumenti di sviluppo del browser (Timeline / Performance, Memory)?

Cause comuni di perdite di memoria:

• Riferimenti pendenti agli oggetti:
  • Timer dimenticati (setInterval, setTimeout) che fanno riferimento a oggetti.
  • Gestori di eventi confusi che non sono stati scollegati (removeEventListener).
  • Chiusure che mantengono variabili esterne più a lungo del necessario.
  • Elementi DOM rimossi dal documento ma con riferimenti in JavaScript.

// Esempio di perdita a causa di un timer dimenticato
const leakyObject = {
  data: 'some data'
};

setInterval(() => {
  console.log(leakyObject.data); // leakyObject non può essere raccolto dal garbage collector
}, 1000);

• Strutture di dati grandi:
  • Creazione e memorizzazione di array o oggetti eccessivamente grandi quando si possono usare iteratori o streaming.
• Uso scorretto delle cache:
  • Cache che crescono indefinitamente senza strategia di espulsione (LRU, LFU, ecc.).
• Perdite da librerie di terze parti:
  • Controllare la documentazione o il codice sorgente delle librerie per eventuali problemi.

Correzione:

1. Annullare eventi e timer: Assicurarsi che tutti i gestori di eventi siano scollegati e i timer siano puliti al distruggere il componente o l'oggetto.

// Pulizia corretta del timer
const leakyObject = {
  data: 'some data'
};
let timerId;

function startTimer() {
  timerId = setInterval(() => {
    console.log(leakyObject.data);
  }, 1000);
}

function stopTimer() {
  clearInterval(timerId); // Pulisci il timer
}

2. Nullificare i riferimenti: Nullificare esplicitamente riferimenti a grandi o non più utilizzati oggetti in modo che il garbage collector possa raccoglierli.
3. Utilizzare WeakMap e WeakSet: Per memorizzare riferimenti a oggetti che possono essere rimossi dal garbage collector quando non hanno altri riferimenti forti.
4. Ottimizzare le strutture dati: Usare strutture dati o approcci più efficienti (ad esempio, caricamento pigro).
5. Limitare la dimensione delle cache: Implementare strategie di espulsione.
6. Aggiornare o sostituire le librerie: Se il problema è in una libreria di terze parti, aggiornarla o trovare un'alternativa.

Dopo aver corretto, riutilizzare gli strumenti di sviluppo per confermare l'assenza di perdite.