JavaScript Performance Optimization

بهینه‌سازی عملکرد در جاوااسکریپت باعث می‌شود برنامه سریع‌تر، سبک‌تر و پاسخگوتر باشد.
با رعایت چند نکته ساده می‌توان مصرف حافظه، زمان اجرا و سرعت بارگذاری را بهبود داد.

🔹 1. استفاده بهینه از متغیرها و Scope

• از let و const استفاده کنید و از ایجاد متغیرهای سطح global خودداری کنید.

• متغیرهای غیرضروری را آزاد کنید تا حافظه مصرف نشود.

function calculate() {
  const result = 10; // محدود به این تابع
}

🔹 2. کاهش دسترسی به DOM

• دسترسی مکرر به DOM کند است.

• تغییرات را جمع‌آوری کنید و یک بار اعمال کنید یا از DocumentFragment استفاده کنید.

// بهینه
const list = document.getElementById("list");
let items = "";
for(let i=0; i<100; i++){
  items += `<li>Item ${i}</li>`;
}
list.innerHTML = items;

🔹 3. استفاده از حلقه‌های بهینه

• حلقه‌های ساده for معمولا سریع‌تر از forEach یا map هستند، مخصوصا در عملیات سنگین.

for(let i = 0; i < arr.length; i++){
  // عملیات سریع
}

🔹 4. استفاده از Debounce و Throttle

• برای رویدادهای پرتکرار مثل scroll یا input از debounce یا throttle استفاده کنید.

function debounce(func, delay) {
  let timer;
  return function() {
    clearTimeout(timer);
    timer = setTimeout(func, delay);
  };
}

🔹 5. Lazy Loading و Code Splitting

• بارگذاری تنها بخش‌های لازم در زمان اجرا

• استفاده از Dynamic Imports و Module Splitting

// Dynamic import
import('./module.js').then(module => {
  module.init();
});

🔹 6. جلوگیری از Memory Leaks

• متغیرها، Event Listenerها و Timerها را بعد از استفاده پاک کنید

• از Closureهای غیرضروری اجتناب کنید

element.removeEventListener('click', handler);

🔹 7. بهینه‌سازی JSON و داده‌ها

• برای داده‌های بزرگ، از JSON.stringify / parse بهینه استفاده کنید

• داده‌های تکراری را در حافظه نگه ندارید

🔹 8. استفاده از Web Workers

• عملیات سنگین را در Thread جداگانه اجرا کنید تا UI مسدود نشود

const worker = new Worker('worker.js');
worker.postMessage(data);

✅ خلاصه

• Performance Optimization → افزایش سرعت، کاهش حافظه و پاسخگویی بهتر

• نکات مهم:

  • مدیریت Scope و حافظه

  • کاهش دسترسی به DOM

  • حلقه‌های بهینه

  • Debounce و Throttle

  • Lazy Loading و Code Splitting

  • جلوگیری از Memory Leaks

  • Web Workers برای عملیات سنگین