Monitoring TypeScript Applications: Tools and Libraries

Monitoring TypeScript Applications: From Diagnostics to Observability

Development in TypeScript today covers both the server side (Node.js, Deno, Bun) and the client side (React, Angular, Vue). However, the more complex the application, the more important it is to understand what is happening in production. Monitoring TypeScript applications is not just about collecting logs, but a full-fledged observability system that includes metrics, tracing, and alerts. In this article, we will review the key libraries and approaches for setting up monitoring.

Why TypeScript Requires a Special Approach

TypeScript compiles to JavaScript, so standard tools for JS also work with TS. However, there are nuances:

• The error stack may point to the compiled code, not the original TS.
• Source maps are mandatory for correct error tracing.
• Typing allows for more precise annotation of metrics and spans.

1. Sentry — The King of Errors for Frontend and Backend

Sentry is the most popular platform for tracking errors and performance. There is an official SDK for TypeScript.

Installation:

npm install @sentry/node @sentry/tracing# or for React:npm install @sentry/react @sentry/tracing

Example for 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, // profiling});

// Automatic error captureapp.get("/api/data", async (req, res) => {  try {    const data = await fetchData();    res.json(data);  } catch (err) {    Sentry.captureException(err);    res.status(500).send("Error");  }});

Features for TypeScript:

• Source maps support: upload them via sentry-cli or a webpack plugin.
• Typing: the SDK exports types for all methods.
• Profiling: see which functions are slowing things down.

2. OpenTelemetry — Universal Observability Standard

OpenTelemetry (OTel) is a set of APIs and SDKs for collecting traces, metrics, and logs. It is well-suited for microservices in TypeScript.

Installation:

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

Tracing setup example:

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

// Applicationimport express from "express";const app = express();app.get("/", (req, res) => {  res.send("Hello OTel!");});app.listen(3000);

Advantages:

• Vendor neutrality: data can be sent to Jaeger, Zipkin, Datadog, Grafana.
• Automatic instrumentation of popular libraries (Express, gRPC, MongoDB).
• TypeScript-first: all SDKs are written in TS with full typing.

3. Prometheus + Client for Metrics

For collecting metrics (RPS, latency, memory), use Prometheus with the prom-client client.

Installation:

npm install prom-client

Example with Express and TypeScript:

import ex