Skip to content

Commit 2987c97

Browse files
feat: Blog post for Observability launch
1 parent 4da5106 commit 2987c97

File tree

1 file changed

+75
-0
lines changed

1 file changed

+75
-0
lines changed
Lines changed: 75 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,75 @@
1+
---
2+
title: 'Introducing integrated observability in SvelteKit'
3+
description: 'SvelteKit apps can now emit OpenTelemetry traces and reliably set up observability instrumentation using instrumentation.server.ts'
4+
author: Elliott Johnson
5+
authorURL: https://bsky.app/profile/gruntled.bsky.social
6+
---
7+
8+
"Observability" is one of those buzzwords that is commonly thrown around as something essential to all good apps
9+
10+
SvelteKit is proud to announce two new experimental features geared towards making observing and debugging your app as easy as possible.
11+
12+
## First-party OpenTelemetry traces
13+
14+
SvelteKit can now emit [OpenTelemetry](https://opentelemetry.io) traces for the following:
15+
16+
- [`handle`](/docs/kit/hooks#Server-hooks-handle) hook (`handle` functions running in a [`sequence`](/docs/kit/@sveltejs-kit-hooks#sequence) will show up as children of each other and the root handle hook)
17+
- [`load`](/docs/kit/load) functions (includes universal `load` functions when they're run on the server)
18+
- [Form actions](docs/kit/form-actions)
19+
- [Remote functions](/docs/kit/remote-functions)
20+
21+
To enable trace emission, add the following to `svelte.config.js`:
22+
23+
```js
24+
/// file: svelte.config.js
25+
export default {
26+
kit: {
27+
+++experimental: {
28+
tracing: {
29+
server: true
30+
}
31+
}+++
32+
}
33+
};
34+
```
35+
36+
If there are additional attributes you think might be useful, please file an issue on the [SvelteKit Github issue tracker](https://github.com/sveltejs/kit/issues).
37+
38+
## A convenient home for all of your instrumentation
39+
40+
Emitting traces alone is not enough: You also need to collect them and send them somewhere. Under normal circumstances, this can be a bit challenging. Because of the nature of observability instrumentation, it needs to be loaded prior to loading any of the code from your app. To aid in this, SvelteKit now supports a `src/instrumentation.server.ts` file which, assuming your adapter supports it, is guaranteed to be loaded prior to your application code. In Node, your instrumentation might look something like this:
41+
42+
```ts
43+
import { NodeSDK } from '@opentelemetry/sdk-node';
44+
import { getNodeAutoInstrumentations } from '@opentelemetry/auto-instrumentations-node';
45+
import { OTLPTraceExporter } from '@opentelemetry/exporter-trace-otlp-proto';
46+
import { createAddHookMessageChannel } from 'import-in-the-middle';
47+
import { register } from 'module';
48+
49+
const { registerOptions } = createAddHookMessageChannel();
50+
register('import-in-the-middle/hook.mjs', import.meta.url, registerOptions);
51+
52+
const sdk = new NodeSDK({
53+
serviceName: 'test-sveltekit-tracing',
54+
traceExporter: new OTLPTraceExporter(),
55+
instrumentations: [getNodeAutoInstrumentations()]
56+
});
57+
58+
sdk.start();
59+
```
60+
61+
...and on Vercel, it would look something like this:
62+
63+
```ts
64+
import { registerOTel } from '@vercel/otel';
65+
66+
registerOTel({
67+
serviceName: 'test-sveltekit-tracing'
68+
});
69+
```
70+
71+
Consult your platform's documentation for specific instrumentation instructions. As of now, all of the official SvelteKit adapters with a server component (sorry, `adapter-static`) support `instrumentation.server.ts`.
72+
73+
## Acknowledgements
74+
75+
A huge thank-you to Lukas Stracke, who kicked us off on this adventure with his excellent [talk at Svelte Summit 2025](https://www.youtube.com/watch?v=hFVmFAyB_YA) and his initial draft PR for `instrumentation.server.ts`. Another thank-you to [Sentry](https://sentry.io/welcome/) for allowing him to spend his working hours reviewing and testing our work.

0 commit comments

Comments
 (0)