تحليل أداء كود TypeScript: إيجاد نقاط الضعف للمبتدئين

مدرب بايثون أونلاين للمبتدئين

تعلم Python بسهولة دون إرهاق نظري. حل مهام عملية مع التحقق التلقائي واكتب الكود مباشرة في المتصفح.

ابدأ الدورة

مقدمة: لماذا يعتبر تحليل أداء TypeScript مهمًا للأداء

\n

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

\n

في هذه المقالة، سنشرح كيفية تحليل أداء كود TypeScript باستخدام الأدوات المدمجة في المتصفح و Node.js. ستتعلم كيفية إيجاد الدوال البطيئة، وتحليل مكدس الاستدعاءات، وتحسين الأجزاء الحرجة.

\n

المقالة موجهة للمطورين المبتدئين الذين هم على دراية بأساسيات TypeScript ويريدون تحسين أداء تطبيقاتهم.

\n\n

المفاهيم الأساسية لتحليل الأداء

\n

تحليل الأداء هو عملية جمع بيانات حول كيفية تنفيذ البرنامج: كم من الوقت تستغرقه الدوال، وكم مرة يتم استدعاؤها، وما هي الموارد المستهلكة.

\n

في سياق TypeScript، من المهم فهم عدة مقاييس رئيسية:

\n
    \n
  • وقت التنفيذ — عدد المللي ثانية التي تستغرقها كل دالة.
  • \n
  • عدد الاستدعاءات — كم مرة يتم استدعاء الدالة.
  • \n
  • الذاكرة — مقدار الذاكرة المخصصة والمحررة.
  • \n
  • مكدس الاستدعاءات — تسلسل استدعاء الدوال.
  • \n
\n

لتحليل أداء كود TypeScript، يمكن استخدام أدوات المتصفح (Chrome DevTools) وأدوات Node.js (مثل --inspect أو clinic.js).

\n\n

أدوات تحليل أداء TypeScript

\n

Chrome DevTools لكود العميل

\n

إذا كان تطبيق TypeScript الخاص بك يعمل في المتصفح، فإن أفضل أداة هي Chrome DevTools المدمجة. افتح علامة التبويب Performance واضغط على زر التسجيل. قم بتنفيذ إجراء على الصفحة، أوقف التسجيل واحصل على الجدول الزمني.

\n

مثال على التحليل: ترى أن الدالة processData تستغرق 300 مللي ثانية. هذه إشارة للتحسين.

\n\n

Node.js وملف تعريف الأداء المدمج

\n

لكود TypeScript من جانب الخادم (Node.js)، استخدم العلم --inspect أو --prof. على سبيل المثال:

\n
node --inspect dist/app.js
\n

ثم افتح chrome://inspect في المتصفح واتصل بالعملية. ستحصل على نفس إمكانيات DevTools، ولكن لكود الخادم.

\n\n

clinic.js — أداة بسيطة لـ Node.js

\n

قم بتثبيت clinic.js بشكل عام:

\n
npm install -g clinic
\n

قم بتشغيل تحليل الأداء:

\n
clinic doctor -- node dist/app.js
\n

ستعرض الأداة تقريرًا مرئيًا مع توصيات.

\n\n

إيجاد نقاط الضعف عمليًا

\n

مثال 1: فرز مصفوفة بطيء

\n

لنفترض أن لديك دالة لفرز مصفوفة كبيرة من الكائنات:

\n
interface User {\n    id: number;\n    name: string;\n    age: number;\n}\n\nfunction sortUsers(users: User[]): User[] {\n    return users.sort((a, b) => {\n        // مقارنة سلاسل بطيئة\n        const nameA = a.name.toLowerCase();\n        const nameB = b.name.toLowerCase();\n        if (nameA < nameB) return -1;\n        if (nameA > nameB) return 1;\n        return 0;\n    });\n}
\n

عند تحليل الأداء، ستلاحظ أن toLowerCase() يتم استدعاؤها لكل مقارنة، وقد يكون عددها O(n log n). نقطة الضعف هي التحويل المتكرر للسلاسل.

\n

التحسين: قم بتحويل السلاسل مسبقًا:

\n
function sortUsersOptimized(users: User[]): User[] {\n    return users\n        .map(user => ({\n            ...user,\n            _lowerName: user.name.toLowerCase()\n        }))\n        .sort((a, b) => {\n            if (a._lowerName < b._lowerName) return -1;\n            if (a._lowerName > b._lowerName) return 1;\n            return 0;\n                

المدونات

توصيات الكتب