Monitoreo de aplicaciones TypeScript: herramientas y bibliotecas

Entrenador de Python en Línea para Principiantes

Aprende Python fácilmente sin sobrecargarte de teoría. Resuelve tareas prácticas con verificación automática, recibe pistas y escribe código directamente en el navegador, sin instalar nada.

Start Course

Monitoreo de aplicaciones TypeScript: desde el diagnóstico hasta la observabilidad



El desarrollo en TypeScript hoy abarca tanto el lado del servidor (Node.js, Deno, Bun) como el lado del cliente (React, Angular, Vue). Sin embargo, cuanto más compleja es la aplicación, más importante es entender qué sucede en producción. El monitoreo de aplicaciones TypeScript no es solo la recopilación de registros, sino un sistema completo de observabilidad que incluye métricas, trazado y alertas. En este artículo, analizaremos las bibliotecas y enfoques clave para configurar el monitoreo.



Por qué TypeScript requiere un enfoque especial

TypeScript se compila a JavaScript, por lo que las herramientas estándar para JS también funcionan con TS. Sin embargo, hay matices:

  • El stack de errores puede apuntar al código compilado, no al TS original.
  • Los source maps son obligatorios para un rastreo de errores correcto.
  • La tipificación permite anotar métricas y spans con mayor precisión.


1. Sentry — el rey de los errores para frontend y backend

Sentry es la plataforma más popular para el seguimiento de errores y rendimiento. Para TypeScript hay un SDK oficial.



Instalación:

npm install @sentry/node @sentry/tracing# o para React:npm install @sentry/react @sentry/tracing


Ejemplo para 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, // perfilado});

// Captura automática de erroresapp.get("/api/data", async (req, res) => { try { const data = await fetchData(); res.json(data); } catch (err) { Sentry.captureException(err); res.status(500).send("Error"); }});


Características para TypeScript:

  • Soporte de source maps: cárguelos mediante sentry-cli o el plugin de webpack.
  • Tipificación: el SDK exporta tipos para todos los métodos.
  • Perfilado: se ve qué funciones están ralentizando.


2. OpenTelemetry — estándar universal de observabilidad

OpenTelemetry (OTel) es un conjunto de API y SDK para recopilar trazas, métricas y registros. Es ideal para microservicios en TypeScript.



Instalación:

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


Ejemplo de configuración de trazado:

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();

// Aplicaciónimport express from "express";const app = express();app.get("/", (req, res) => { res.send("¡Hola OTel!");});app.listen(3000);


Ventajas:

  • Neutralidad de proveedor: los datos se pueden enviar a Jaeger, Zipkin, Datadog, Grafana.
  • Instrumentación automática de bibliotecas populares (Express, gRPC, MongoDB).
  • TypeScript-first: todos los SDK están escritos en TS con tipificación completa.


3. Prometheus + cliente para métricas

Para la recopilación de métricas (RPS, latencia, memoria) use Prometheus con el cliente prom-client.



Instalación:

npm install prom-client


Ejemplo con Express y TypeScript:

import ex                    

Recommendations