Frontend framework

Svelte observability, live in minutes.

Browser traces for Svelte and SvelteKit over standard OpenTelemetry today, with a first-party SDK in private beta.

Create a project Full Svelte docs
Three steps

Standard OpenTelemetry, pointed at us.

No proprietary agent, no vendor SDK required on the server. If your service already exports OTLP, step two is the whole integration.

Private beta. The first-party SDK for this framework is in private beta and is not published to a public registry yet. Email [email protected] for access. Everything on this page that uses the OpenTelemetry SDKs works today.
  1. STEP 1
    Create a project

    Sign up, create a project, and copy its ingest token. Nothing to install on our side.

  2. STEP 2
    Point your exporter at us

    Set OTEL_EXPORTER_OTLP_ENDPOINT to https://ingest.tracepath.dev/api/otel and OTEL_EXPORTER_OTLP_HEADERS to "Authorization=Bearer <token>". If you already emit OpenTelemetry, that is the whole integration.

  3. STEP 3
    Or wire the SDK explicitly

    Prefer code over environment variables? Configure the OTLP exporters yourself, exactly as in the sample below. Standard OpenTelemetry packages only — nothing TracePath-specific.

Real code

A working instrumentation.ts.

Standard OpenTelemetry packages only — this is the actual shape of a Svelte integration against TracePath.

import {
  WebTracerProvider,
  BatchSpanProcessor,
} from "@opentelemetry/sdk-trace-web";
import { OTLPTraceExporter } from "@opentelemetry/exporter-trace-otlp-http";
import { registerInstrumentations } from "@opentelemetry/instrumentation";
import { getWebAutoInstrumentations } from "@opentelemetry/auto-instrumentations-web";
import { resourceFromAttributes } from "@opentelemetry/resources";

const exporter = new OTLPTraceExporter({
  url: "https://ingest.tracepath.dev/api/otel/v1/traces",
  headers: { Authorization: `Bearer ${import.meta.env.VITE_TRACEPATH_TOKEN}` },
});

const provider = new WebTracerProvider({
  resource: resourceFromAttributes({ "service.name": "my-sveltekit-app" }),
  spanProcessors: [new BatchSpanProcessor(exporter)],
});

provider.register();

registerInstrumentations({
  instrumentations: [getWebAutoInstrumentations()],
});
What you get

Built for Svelte.

Document load, navigation and fetch spans via the OpenTelemetry Web SDK

Server-side traces from the SvelteKit Node adapter on the same pipeline

Source-map upload for minified production bundles

SSR-safe first-party SDK with session recording: private beta

Other frameworks

Next.jsNestJSExpressHonoGoFlutterReactVue

Instrument Svelte today.

Free plan, no credit card. First event in under five minutes.

Start freeSee pricing