Performance Optimization

Performance Optimization

Writing efficient JavaScript is crucial for fast web applications. Learn techniques to optimize your code.

Debouncing and Throttling

// Debounce - Execute after delay
function debounce(func, delay) {
  let timeout;
  return function(...args) {
    clearTimeout(timeout);
    timeout = setTimeout(() => func(...args), delay);
  };
}

// Throttle - Execute at most once per period
function throttle(func, limit) {
  let inThrottle;
  return function(...args) {
    if (!inThrottle) {
      func(...args);
      inThrottle = true;
      setTimeout(() => inThrottle = false, limit);
    }
  };
}

Memoization

function memoize(fn) {
  const cache = {};
  return function(...args) {
    const key = JSON.stringify(args);
    if (cache[key]) return cache[key];
    cache[key] = fn(...args);
    return cache[key];
  };
}

Lazy Loading

// Load resources only when needed
const loadModule = () => import('./module.js');

Virtual Scrolling

Render only visible items in long lists to improve performance.