Day 37

Memory Management

11 min
JavaScript 100 Days

Memory leak tab hota hai jab app memory use karta rehta hai aur release nahi karta. Yeh app ko slow karta hai ya crash. JavaScript mein garbage collection automatic hoti hai lekin hum bugs kar sakte hain.

Memory Leaks

Common memory leak patterns aur unhe avoid karne ke tarike.

memory-leak.js
javascript
// ❌ Memory Leak — event listener remove nahi kiya
function badCode() {
  let bigArray = new Array(1000000).fill("data");
  
  document.getElementById("btn").addEventListener("click", () => {
    console.log(bigArray.length); // bigArray never freed!
  });
}

// ✅ Fix — cleanup karo
function goodCode() {
  let bigArray = new Array(1000000).fill("data");
  
  function handler() {
    console.log(bigArray.length);
  }
  
  const btn = document.getElementById("btn");
  btn.addEventListener("click", handler);
  
  // Cleanup function return karo
  return () => {
    btn.removeEventListener("click", handler);
    bigArray = null; // release memory
  };
}

const cleanup = goodCode();
// Jab zaroorat na rahe: cleanup();

Chrome DevTools

Memory tab se leaks dhundo.

detect.js
javascript
// Performance.memory check karo (Chrome only)
if (performance.memory) {
  console.log("Used JS Heap:", 
    (performance.memory.usedJSHeapSize / 1048576).toFixed(2), "MB");
  console.log("Total Heap:", 
    (performance.memory.totalJSHeapSize / 1048576).toFixed(2), "MB");
}

// Chrome DevTools:
// 1. F12 → Memory tab
// 2. Take Heap Snapshot
// 3. Action karo
// 4. Another snapshot → compare

🎯 Practice Challenge

10 click listeners add karo, phir sab remove karo. DevTools se verify karo ke memory free ho gayi.