Überwachung von TypeScript-Anwendungen: Metriken und Alarme

Online Python-Trainer für Anfänger

Lernen Sie Python einfach ohne theoretische Überlastung. Lösen Sie praktische Aufgaben mit automatischer Überprüfung und schreiben Sie Code direkt im Browser.

Kurs starten

Überwachung von TypeScript-Anwendungen: Von Metriken zu intelligenten Alarmen

In der modernen Softwareentwicklung ist das Schreiben von Code nur die halbe Miete. Es ist entscheidend zu verstehen, wie sich die Anwendung in der Produktion verhält. Für TypeScript-Projekte, sei es ein Server mit Node.js oder ein Client mit React, wird eine proaktive Überwachung zur zwingenden Anforderung. In diesem Artikel behandeln wir fortgeschrittene Techniken zur Erfassung von Metriken, zur Einrichtung von Alarmen und zum Aufbau eines Observability-Systems, das Ihnen einen ruhigen Schlaf ermöglicht.

1. Wichtige Metriken für TypeScript-Anwendungen

Bevor wir Alarme einrichten, müssen wir definieren, was genau wir messen. Wir unterteilen die Metriken in drei Gruppen: Infrastruktur-, Geschäfts- und Benutzermetriken.

Infrastrukturmetriken (RED-Methodik):

Rate — Anzahl der Anfragen pro Sekunde (RPS).
Errors — Fehlerprozentsatz (5xx, 4xx, unbehandelte Zurückweisungen).
Duration — Antwortzeit (p50, p95, p99).

Geschäftsmetriken:

Anzahl erfolgreicher Transaktionen.
Ausführungszeit kritischer Vorgänge (z. B. Berichtserstellung).
Aktive Benutzer (DAU/MAU).

Benutzermetriken (für Client-Anwendungen):

LCP (Largest Contentful Paint) — Ladegeschwindigkeit des Hauptinhalts.
FID (First Input Delay) — Verzögerung der ersten Interaktion.
CLS (Cumulative Layout Shift) — Stabilität des visuellen Layouts.

Zum Erfassen dieser Metriken in TypeScript verwenden wir die Bibliothek prom-client (für Node.js) und @opentelemetry/instrumentation-http.

2. Erfassen von Metriken mit Prometheus und OpenTelemetry

Betrachten wir ein Beispiel für die Einrichtung von Metriken für eine Express-Anwendung in TypeScript. Installieren Sie die erforderlichen Pakete:

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

Erstellen Sie eine Datei metrics.ts zur Registrierung von Metriken:

import client from 'prom-client';

const collectDefaultMetrics = client.collectDefaultMetrics;collectDefaultMetrics({ timeout: 5000 });

export const httpRequestDuration = new client.Histogram({    name: 'http_request_duration_seconds',    help: 'Duration of HTTP requests in seconds',    labelNames: ['method', 'route', 'status_code'],    buckets: [0.01, 0.05, 0.1, 0.5, 1, 2, 5],});

export const errorCounter = new client.Counter({    name: 'http_errors_total',    help: 'Total number of HTTP errors',    labelNames: ['method', 'route', 'status_code'],});

Integrieren Sie nun die Metriken in die Middleware:

import { Request, Response, NextFunction } from 'express';

export function metricsMiddleware(req: Request, res: Response, next: NextFunction) {    const end = httpRequestDuration.startTimer();    res.on('finish', () => {        end({ method: req.method, route: req.route?.path || 'unknown', status_code: res.statusCode.toString() });        if (res.statusCode >= 500) {            errorCounter.inc({ method: req.method, route: req.route?.path || 'unknown', status_code: res.statusCode.toString() });        }    });    next();}

Fügen Sie einen Endpunkt für die Erfassung von Prometheus-Metriken hinzu:

import { Router } from 'express';import client from 'prom-client';

const router = Router();router.get('/metrics', async (req, res) => {    res.set('Content-Type', client.register.contentType);    res.end(await client.register.metrics());});export default router;

Für Client-Anwendungen (React) verwenden Sie @opentelemetry/instrumentation-document-load zur automatischen Erfassung von Web Vitals.