0Pricing
JavaScript Academy · درس

مقدمة إلى تحديد الأداء (Node/DevTools) — عادات توقيت صغيرة

حدّدوا الأداء بخطوات صغيرة: قيسوا باستخدام console.time/timeEnd ومؤقتات بسيطة، واعثروا على الشيفرة الساخنة، وغيّروا شيئًا واحدًا، ثم أعيدوا القياس

مقدمة إلى تحديد الأداء (Node/DevTools) — عادات توقيت صغيرة درس مجاني في JavaScript Academy على CoddyKit. هذا هو الدرس 3 من أصل 3. يمكنك قراءة الدرس كاملاً أدناه مجاناً — ثم تمرن عليه مباشرة في المتصفح باستخدام محرر أكواد مدمج ومدرس ذكاء اصطناعي متاح 24/7. هذا الدرس جزء من مسار التعلم في JavaScript Academy، وتقدمك يتزامن عبر الويب وتطبيق CoddyKit. تتضمن دورة JavaScript Academy 3 دروس في المجموع.

لماذا تحليل الأداء؟

الهدف: قِس → غيّر → قِس مجددًا.

  • استخدم console.time/timeEnd لقياس سريع للزمن
  • استخدم دالة مساعدة صغيرة now() للقياسات اليدوية
  • ركّز على الشيفرة الساخنة فقط
  • غيّر شيئًا واحدًا في كل مرة
مقدمة إلى تحديد الأداء (Node/DevTools) — عادات توقيت صغيرة — رسم توضيحي 1

عرض توضيحي لـ console.time

يطبع console.time المدة التي استغرقها الجزء المسمّى. وهذه خطوة أولى ممتازة.

// Measure a small loop with console.time/timeEnd
console.time("sum");
let s = 0;
for (let i = 0; i < 100000; i = i + 1) {
  s = s + i;
}
console.timeEnd("sum");
console.log("sum value:", s);
مقدمة إلى تحديد الأداء (Node/DevTools) — عادات توقيت صغيرة — رسم توضيحي 2

دالة مساعدة للقياس اليدوي

يساعد القياس اليدوي على إحاطة أي دالة ومقارنة عمليات تنفيذها باستخدام الإدخال نفسه.

// A tiny now() helper that works in many runtimes
const now = (typeof performance !== "undefined" && performance.now)
  ? function () { return performance.now(); }
  : function () { return Date.now(); };

// Time a function manually
function timeFn(label, fn) {
  const t1 = now();
  const out = fn();
  const t2 = now();
  console.log(label + " ms:", (t2 - t1));
  return out;
}

timeFn("small work", function () {
  let x = 0;
  for (let i = 0; i < 50000; i = i + 1) { x = x + i; }
  return x;
});
مقدمة إلى تحديد الأداء (Node/DevTools) — عادات توقيت صغيرة — رسم توضيحي 3

العثور على الشيفرة الساخنة

تتبّع الاستدعاءات والزمن لمعرفة أين يستهلك تطبيقك وقت المعالجة؛ ثم حسّن أكثر الدوال سخونة أولًا.

// Count calls and total time to find hot spots
const metrics = { calls: 0, totalMs: 0 };

function hotWork(n) {
  const t1 = now();
  let sum = 0;
  for (let i = 0; i < n; i = i + 1) {
    sum = sum + (i % 3);
  }
  const t2 = now();
  metrics.calls = metrics.calls + 1;
  metrics.totalMs = metrics.totalMs + (t2 - t1);
  return sum;
}

// Simulate usage
for (let k = 0; k < 5; k = k + 1) {
  hotWork(80000);
}
console.log("calls:", metrics.calls, "avg ms:", metrics.totalMs / metrics.calls);
مقدمة إلى تحديد الأداء (Node/DevTools) — عادات توقيت صغيرة — رسم توضيحي 4

القياس قبل التغيير وبعده

قِس قبل التغيير وبعده. استخدم الإدخال نفسه وقارن الأرقام فقط.

// Compare two approaches with the same input
const hay = [];
for (let i = 0; i < 2000; i = i + 1) { hay.push(String(i)); }

const needles = [];
for (let i = 0; i < 1000; i = i + 1) { needles.push(String(i * 2)); }

function slowIncludes() {
  let count = 0;
  for (const n of needles) {
    if (hay.includes(n)) { count = count + 1; }
  }
  return count;
}

function fastSet() {
  const set = new Set(hay);
  let count = 0;
  for (const n of needles) {
    if (set.has(n)) { count = count + 1; }
  }
  return count;
}

const c1 = timeFn("includes run", slowIncludes);
const c2 = timeFn("set.has run", fastSet);
console.log("counts:", c1, c2);
مقدمة إلى تحديد الأداء (Node/DevTools) — عادات توقيت صغيرة — رسم توضيحي 5

ممارسات جيدة للقياس

نصائح:

  • استخدم المدخلات نفسها في عمليات التنفيذ المختلفة.
  • نفّذ عملية إحماء مرة واحدة، ثم قِس.
  • قلّل السجلات أثناء القياس.
  • غيّر شيئًا واحدًا ثم أعد القياس.
  • توفّر DevTools/Node أدوات تسجيل؛ فابدأ باستخدام console.time البسيط.
مقدمة إلى تحديد الأداء (Node/DevTools) — عادات توقيت صغيرة — رسم توضيحي 6

اختبار أساسيات console.time

فحص سريع: أداة سريعة لقياس الزمن.

مقدمة إلى تحديد الأداء (Node/DevTools) — عادات توقيت صغيرة — رسم توضيحي 7

مراجعة

مراجعة: ابدأ باستخدام console.time ودالة مساعدة صغيرة هي now(). اعثر على الشيفرة الساخنة، وأجرِ تغييرًا بسيطًا، ثم أعد القياس باستخدام المدخلات نفسها.

مقدمة إلى تحديد الأداء (Node/DevTools) — عادات توقيت صغيرة — رسم توضيحي 8

الأسئلة الشائعة

هل درس «مقدمة إلى تحديد الأداء (Node/DevTools) — عادات توقيت صغيرة» مجاني؟

نعم — نص درس «مقدمة إلى تحديد الأداء (Node/DevTools) — عادات توقيت صغيرة» كامل متاح مجاناً هنا على الويب. لتمرينه بشكل تفاعلي (محرر أكواد مدمج ومدرس ذكاء اصطناعي متاح 24/7) وفتح باقي دورة JavaScript Academy، انتقل إلى CoddyKit PRO. تتضمن دورة JavaScript Academy 3 دروس في المجموع.

ماذا ستتعلم في «مقدمة إلى تحديد الأداء (Node/DevTools) — عادات توقيت صغيرة»؟

حدّدوا الأداء بخطوات صغيرة: قيسوا باستخدام console.time/timeEnd ومؤقتات بسيطة، واعثروا على الشيفرة الساخنة، وغيّروا شيئًا واحدًا، ثم أعيدوا القياس تتمرن على JavaScript Academy مع أكواد عملية تشغلها مباشرة في المتصفح، ومدرس ذكاء اصطناعي متاح 24/7 يجيب على أسئلتك أثناء عملك.

هل أحتاج إلى خبرة سابقة لأبدأ JavaScript Academy؟

لا تُشترط خبرة سابقة. JavaScript Academy على CoddyKit منظم للمبتدئين حتى المتقدمين، لذا يمكنك البدء من هنا أو من البداية والتقدم بسرعتك الخاصة. هذا هو الدرس 3 من أصل 3.

كم من الوقت يستغرق درس «مقدمة إلى تحديد الأداء (Node/DevTools) — عادات توقيت صغيرة»؟

معظم دروس CoddyKit تستغرق حوالي 5–10 دقائق. كل منها موجز وتفاعلي، لذا تحرز تقدماً مستمراً وتستأنف من حيث توقفت عبر الويب والتطبيق.

هل يمكنني كتابة وتشغيل أكواد في درس JavaScript Academy هذا؟

نعم. كل درس في JavaScript Academy يتضمن محرر أكواد مدمج، لذا تكتب وتشغل أكواداً حقيقية مباشرة في متصفحك وتحصل على تعليقات فورية من الذكاء الاصطناعي — بدون إعداد محلي.

جميع الدروس في هذه الدورة

  1. أساسيات Big-O والمسارات الساخنة مقابل الباردة (مكاسب للمبتدئين)
  2. تجنب تسرّبات الذاكرة — الإغلاقات والمؤقتات والمراجع
  3. مقدمة إلى تحديد الأداء (Node/DevTools) — عادات توقيت صغيرة
← العودة إلى JavaScript Academy