or run

npx @tessl/cli init
Log in

Version

Tile

Overview

Evals

Files

docs

examples

edge-cases.mdreal-world-scenarios.md
index.md
tile.json

configuration.mddocs/guides/

Configuration Guide

Complete guide to configuring Dash0 Web SDK.

Required Configuration

init({
  serviceName: "my-website",  // Required
  endpoint: {                  // Required
    url: "https://ingress.dash0.com",
    authToken: "auth_your_token_here",
  },
});

Optional Configuration

Service Information

init({
  serviceName: "my-website",
  serviceVersion: "1.2.3",     // Optional: service version
  environment: "production",    // Optional: environment name
  deploymentName: "prod-us",    // Optional: deployment identifier
  deploymentId: "deploy-123",   // Optional: deployment ID
  endpoint: { url: "...", authToken: "..." },
});

Instrumentation Control

Enable or disable specific instrumentations:

init({
  serviceName: "my-website",
  endpoint: { url: "...", authToken: "..." },
  enabledInstrumentations: [
    "@dash0/navigation",  // Page views and navigation timing
    "@dash0/web-vitals", // Core Web Vitals (CLS, INP, LCP)
    "@dash0/error",      // Error tracking
    "@dash0/fetch",      // HTTP request instrumentation
  ],
});

Default: All instrumentations are enabled if not specified.

Session Timeouts

Configure session lifecycle:

init({
  serviceName: "my-website",
  endpoint: { url: "...", authToken: "..." },
  sessionInactivityTimeoutMillis: 10800000,    // 3 hours (default)
  sessionTerminationTimeoutMillis: 21600000,     // 6 hours (default)
});

Maximum: 24 hours (86400000 ms) for both timeouts.

Trace Propagation

Configure distributed tracing headers:

init({
  serviceName: "my-website",
  endpoint: { url: "...", authToken: "..." },
  propagators: [
    // W3C traceparent for internal APIs
    { type: "traceparent", match: [/.*\/api\/internal.*/] },
    // AWS X-Ray for AWS services
    { type: "xray", match: [/.*\.amazonaws\.com.*/] },
  ],
});

URL Filtering

Filter out URLs from telemetry:

init({
  serviceName: "my-website",
  endpoint: { url: "...", authToken: "..." },
  ignoreUrls: [
    /.*\/health$/,
    /.*\/ping$/,
  ],
});

Error Filtering

Filter out error messages:

init({
  serviceName: "my-website",
  endpoint: { url: "...", authToken: "..." },
  ignoreErrorMessages: [
    /Script error/i,
    /Non-Error promise rejection/i,
  ],
});

URL Scrubbing

Remove sensitive data from URLs:

init({
  serviceName: "my-website",
  endpoint: { url: "...", authToken: "..." },
  urlAttributeScrubber: (attrs) => {
    // Redact sensitive query parameters
    if (attrs["url.query"]?.includes("token=")) {
      attrs["url.query"] = attrs["url.query"].replace(
        /token=[^&]+/,
        "token=REDACTED"
      );
    }
    return attrs;
  },
});

Error Tracking Options

init({
  serviceName: "my-website",
  endpoint: { url: "...", authToken: "..." },
  wrapEventHandlers: true,  // Wrap DOM event handlers (default: true)
  wrapTimers: true,         // Wrap setTimeout/setInterval (default: true)
});

HTTP Instrumentation

init({
  serviceName: "my-website",
  endpoint: { url: "...", authToken: "..." },
  maxWaitForResourceTimingsMillis: 10000,      // 10 seconds (default)
  maxToleranceForResourceTimingsMillis: 50,    // 50ms (default)
  headersToCapture: [/^X-.*/],                 // Capture matching headers
});

Page View Instrumentation

Configure virtual page view tracking for SPAs:

init({
  serviceName: "my-website",
  endpoint: { url: "...", authToken: "..." },
  pageViewInstrumentation: {
    trackVirtualPageViews: true,
    includeParts: ["HASH", "SEARCH"],  // Track hash/search changes
    generateMetadata: (url) => {
      if (url.pathname.startsWith("/product/")) {
        return {
          title: "Product Page",
          attributes: {
            "page.category": "product",
          },
        };
      }
      return undefined;
    },
  },
});

Signal Attributes

Add attributes to all telemetry signals:

init({
  serviceName: "my-website",
  endpoint: { url: "...", authToken: "..." },
  additionalSignalAttributes: {
    "app.region": "us-east-1",
    "app.tier": "premium",
    "app.version": "1.2.3",
  },
});

Multiple Endpoints

Send telemetry to multiple endpoints:

init({
  serviceName: "my-website",
  endpoint: [
    {
      url: "https://primary.dash0.com",
      authToken: "auth_primary_token",
      dataset: "production",
    },
    {
      url: "https://backup.monitoring.com",
      authToken: "auth_backup_token",
    },
  ],
});

Transport Options

init({
  serviceName: "my-website",
  endpoint: { url: "...", authToken: "..." },
  enableTransportCompression: false,  // Experimental: gzip compression
});

Auto-Detection (Vercel/Next.js)

The SDK can auto-detect configuration from Next.js environment variables:

Config KeyEnvironment Variable
environmentNEXT_PUBLIC_VERCEL_ENV
deploymentNameNEXT_PUBLIC_VERCEL_TARGET_ENV
deploymentIdNEXT_PUBLIC_VERCEL_BRANCH_URL

Explicit configuration values override auto-detected values.

Configuration Best Practices

  1. Call Early: Initialize SDK as early as possible in page lifecycle
  2. Required Fields: Always provide serviceName and endpoint
  3. Environment-Specific: Use different configs for dev/staging/production
  4. Filter Sensitive Data: Use URL scrubbers and ignore patterns
  5. Session Timeouts: Adjust based on your application's usage patterns
  6. Multiple Endpoints: Use for redundancy or different datasets

See Initialization Reference for complete API documentation.