مراقبة تطبيقات TypeScript: الأدوات والمكتبات

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

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

ابدأ الدورة

مراقبة تطبيقات TypeScript: من التشخيص إلى المراقبة



تغطي التطوير باستخدام TypeScript اليوم كلاً من جانب الخادم (Node.js، Deno، Bun) وجانب العميل (React، Angular، Vue). ولكن كلما كان التطبيق أكثر تعقيدًا، زادت أهمية فهم ما يحدث في بيئة الإنتاج. مراقبة تطبيقات TypeScript ليست مجرد جمع للسجلات، بل هي نظام كامل للمراقبة يشمل المقاييس، والتتبع، والتنبيهات. في هذه المقالة، سنستعرض المكتبات والأساليب الرئيسية لإعداد المراقبة.



لماذا يتطلب TypeScript نهجًا خاصًا

يتم تجميع TypeScript إلى JavaScript، لذا فإن الأدوات القياسية لـ JavaScript تعمل مع TypeScript أيضًا. ومع ذلك، هناك بعض الفروق الدقيقة:

  • قد يشير تتبع الأخطاء إلى الكود المترجم، وليس إلى كود TypeScript الأصلي.
  • خرائط المصدر (Source maps) إلزامية لتتبع الأخطاء بشكل صحيح.
  • الكتابة (Typing) تسمح بتعليق أكثر دقة للمقاييس والامتدادات (spans).


1. Sentry — ملك الأخطاء للواجهة الأمامية والخلفية

Sentry هي المنصة الأكثر شهرة لتتبع الأخطاء والأداء. يوجد SDK رسمي لـ TypeScript.



التثبيت:

npm install @sentry/node @sentry/tracing# أو لـ React:npm install @sentry/react @sentry/tracing


مثال لـ Node.js:

import * as Sentry from "@sentry/node";import { ProfilingIntegration } from "@sentry/profiling-node";

Sentry.init({ dsn: "https://examplePublicKey@o0.ingest.sentry.io/0", integrations: [new ProfilingIntegration()], tracesSampleRate: 1.0, profilesSampleRate: 1.0, // التنميط});

// التقاط الأخطاء تلقائيًاapp.get("/api/data", async (req, res) => { try { const data = await fetchData(); res.json(data); } catch (err) { Sentry.captureException(err); res.status(500).send("Error"); }});


ميزات خاصة بـ TypeScript:

  • دعم خرائط المصدر: قم بتحميلها عبر sentry-cli أو إضافة webpack.
  • الكتابة: يقوم SDK بتصدير الأنواع لجميع الطرق.
  • التنميط: يمكن رؤية أي الوظائف تسبب البطء.


2. OpenTelemetry — المعيار العالمي للمراقبة

OpenTelemetry (OTel) هي مجموعة من واجهات برمجة التطبيقات (API) ومجموعات تطوير البرامج (SDK) لجمع التتبعات والمقاييس والسجلات. مناسبة تمامًا للخدمات المصغرة على TypeScript.



التثبيت:

npm install @opentelemetry/api @opentelemetry/sdk-node @opentelemetry/instrumentation-http @opentelemetry/instrumentation-express


مثال لإعداد التتبع:

import { NodeSDK } from "@opentelemetry/sdk-node";import { ConsoleSpanExporter } from "@opentelemetry/sdk-trace-node";import { getNodeAutoInstrumentations } from "@opentelemetry/auto-instrumentations-node";

const sdk = new NodeSDK({ traceExporter: new ConsoleSpanExporter(), instrumentations: [getNodeAutoInstrumentations()],});

sdk.start();

// التطبيقimport express from "express";const app = express();app.get("/", (req, res) => { res.send("Hello OTel!");});app.listen(3000);


المزايا:

  • الحياد تجاه البائعين: يمكن إرسال البيانات إلى Jaeger، Zipkin، Datadog، Grafana.
  • الأتمتة الآلية للمكتبات الشائعة (Express، gRPC، MongoDB).
  • TypeScript-first: جميع SDK مكتوبة بلغة TypeScript مع كتابة كاملة.


3. Prometheus + عميل للمقاييس

لجمع المقاييس (RPS، زمن الاستجابة، الذاكرة) استخدم Prometheus مع عميل prom-client.



التثبيت:

npm install prom-client


مثال مع Express و TypeScript:

import ex                    

توصيات