0Pricing
JavaScript Academy · Leçon

Éviter les fuites — fermetures, minuteurs et références

Prévenez les fuites mémoire en effaçant les minuteurs, en limitant les fermetures et en supprimant les références inutilisées ; utilisez de petits modèles applicables par les débutants

Éviter les fuites — fermetures, minuteurs et références est une leçon JavaScript Academy gratuite sur CoddyKit. Ceci est la leçon 2 sur 3. Tu peux lire la leçon complète ci-dessous gratuitement — puis la pratiquer en direct dans le navigateur avec un éditeur de code intégré et un tuteur IA 24/7. Elle fait partie du parcours d'apprentissage JavaScript Academy, et ta progression se synchronise sur le web et l'application CoddyKit. Le cours JavaScript Academy comprend 3 leçons au total.

Qu'est-ce qu'une fuite ?

Objectif : éviter les fuites simples.

  • Effacez toujours les minuteurs
  • Ne conservez pas les références inutilisées
  • Gardez les fermetures petites
  • Préférez les données à courte durée de vie
Éviter les fuites — fermetures, minuteurs et références — illustration 1

Effacer les intervalles

Conservez l'identifiant de l'intervalle ; appelez clearInterval lors du nettoyage afin que le minuteur et les valeurs qu'il capture puissent être collected.

// Start an interval and then clear it to avoid leaks
function startTicker() {
  // store id so we can clear later
  const id = setInterval(function () {
    // work would run every X ms; omitted for demo
  }, 1000);

  // simulate screen close / cleanup
  clearInterval(id);
  console.log("interval cleared");
}

startTicker();
Éviter les fuites — fermetures, minuteurs et références — illustration 2

Des fermetures plus petites

Les fermetures conservent ce qu'elles capturent. Capturez des petites valeurs plutôt que des objets entiers lorsque c'est possible.

// Avoid capturing large objects when only small data is needed
function makeReporter(bigArray) {
  // BAD: store the whole array inside the closure
  const large = bigArray;

  return function reportLength() {
    // Only the length is used
    return large.length;
  };
}

// BETTER: capture only what you need
function makeReporterBetter(bigArray) {
  const count = bigArray.length; // small number
  return function reportLength() {
    return count;
  };
}

const arr = new Array(1000).fill(0);
const bad = makeReporter(arr);
const good = makeReporterBetter(arr);
console.log("bad:", bad(), "good:", good());
Éviter les fuites — fermetures, minuteurs et références — illustration 3

Limiter vos tampons

Les tableaux et maps conservés longtemps peuvent provoquer des fuites de mémoire s'ils grandissent sans limite ; réduisez-les ou réinitialisez-les régulièrement.

// A growing buffer can leak if never trimmed or reset
const buffer = []; // module-level array

function logItem(x) {
  buffer.push(x); // grows forever if not managed
}

// Simulate usage
logItem("a");
logItem("b");

// FIX: trim or reset when size is over a limit
function trimBuffer(limit) {
  if (buffer.length > limit) {
    buffer.length = limit; // drop old items
  }
}

trimBuffer(1);
console.log("buffer size:", buffer.length);
Éviter les fuites — fermetures, minuteurs et références — illustration 4

Découvrir WeakMap

WeakMap est utile pour associer des métadonnées sans empêcher la collecte des déchets de l'objet utilisé comme clé.

// WeakMap holds keys weakly: when the object is gone, the entry can be collected
const meta = new WeakMap();

function attachMeta(obj, info) {
  meta.set(obj, info);
}

function readMeta(obj) {
  return meta.get(obj); // undefined if not set or collected
}

let user = { name: "Ayla" };
attachMeta(user, { seen: true });
console.log("meta now:", readMeta(user));

// Later: drop the only strong reference
user = null; // after this, the object and its metadata can be GC'd at some point
console.log("object reference dropped (cannot show GC in console)");
Éviter les fuites — fermetures, minuteurs et références — illustration 5

Bonnes pratiques de prévention des fuites

Liste de vérification :

  • Stockez les identifiants des minuteurs ; utilisez clearInterval/clearTimeout lors du nettoyage.
  • Ne capturez que les valeurs nécessaires dans les fermetures.
  • Réduisez ou réinitialisez les tableaux et maps conservés longtemps.
  • Préférez les données à courte durée de vie ; supprimez les références une fois le travail terminé.
Éviter les fuites — fermetures, minuteurs et références — illustration 6

Question sur le nettoyage des minuteurs

Vérification rapide : minuteurs et fuites.

Éviter les fuites — fermetures, minuteurs et références — illustration 7

Récapitulatif

Récapitulatif : effacez les minuteurs, évitez de capturer d'énormes objets dans les fermetures, et réduisez ou supprimez les références conservées longtemps. De petits nettoyages empêchent les applications destinées aux débutants de provoquer des fuites de mémoire.

Éviter les fuites — fermetures, minuteurs et références — illustration 8

Questions Fréquemment Posées

La leçon « Éviter les fuites — fermetures, minuteurs et références » est-elle gratuite ?

Oui — le texte complet de « Éviter les fuites — fermetures, minuteurs et références » est gratuit à lire ici sur le web. Pour la pratiquer de manière interactive (un éditeur de code intégré et un tuteur IA 24/7) et déverrouiller le reste du cours JavaScript Academy, passe à CoddyKit PRO. Le cours JavaScript Academy comprend 3 leçons au total.

Qu'est-ce que j'apprendrai dans « Éviter les fuites — fermetures, minuteurs et références » ?

Prévenez les fuites mémoire en effaçant les minuteurs, en limitant les fermetures et en supprimant les références inutilisées ; utilisez de petits modèles applicables par les débutants Tu pratiques JavaScript Academy avec du code pratique que tu exécutes directement dans le navigateur, et un tuteur IA 24/7 répond à tes questions au fur et à mesure que tu avances dans la leçon.

Dois-je avoir de l'expérience pour commencer JavaScript Academy ?

Aucune expérience préalable n'est requise. JavaScript Academy sur CoddyKit est structuré pour les débutants jusqu'aux apprenants avancés, donc tu peux commencer ici ou depuis le début et avancer à ton rythme. Ceci est la leçon 2 sur 3.

Combien de temps prend la leçon « Éviter les fuites — fermetures, minuteurs et références » ?

La plupart des leçons CoddyKit prennent environ 5–10 minutes. Chacune est courte et interactive, tu progresses régulièrement et tu repiques exactement où tu t'es arrêté sur le web et l'app.

Peux-tu écrire et exécuter du code dans cette leçon JavaScript Academy ?

Oui. Chaque leçon JavaScript Academy inclut un éditeur de code intégré, tu écris et exécutes du vrai code directement dans ton navigateur et tu reçois des retours IA instantanés — aucune configuration locale requise.

Toutes les leçons de ce cours

  1. Notions de base de Big-O, chemins chauds ou froids (réussites pour débutants)
  2. Éviter les fuites — fermetures, minuteurs et références
  3. Introduction au profilage (Node/DevTools) — petites habitudes de mesure du temps
← Retour à JavaScript Academy