Frontend framework

Svelte observability, live in minutes.

One setupTracePath call in your root layout covers Svelte and SvelteKit, SSR included.

Create a project Full Svelte docs
Three ways in

Snippet, wizard, or manual.

Lead with the fastest path — the copy-paste snippet with your token baked in. The wizard and manual setup stay available.

  1. STEP 1
    Copy-paste the snippet

    Create a Svelte project and call setupTracePath in src/routes/+layout.svelte.

  2. STEP 2
    Run the wizard

    npx tracepath-wizard installs @tracepath/svelte and edits the layout.

  3. STEP 3
    Manual path

    npm install @tracepath/svelte, then call setupTracePath in your root layout.

Real code

A working +layout.svelte.

Taken from our own examples and docs — this is the actual shape of a Svelte integration.

<!-- src/routes/+layout.svelte -->
<script>
  import { setupTracePath } from "@tracepath/svelte";

  setupTracePath({
    connectionString: "your-token@https://ingest.tracepath.dev/api/report",
  });
</script>

<slot />

Source: docs/pages/client/svelte/index.mdx in the TracePath repo. TODO-verify: snippet matches the latest SDK release before publishing.

What you get

Built for Svelte.

SSR-safe initialization (no browser guard needed)

getTracePath() context for components

Session recording on by default

Svelte 5 runes-compatible

Browse everything tagged #svelte →

Other frameworks

Next.jsNestJSExpressHonoGoFlutterReactVue

Instrument Svelte today.

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

Start freeSelf-host instead