diff --git a/docs/platforms/javascript/common/configuration/integrations/browsersession.mdx b/docs/platforms/javascript/common/configuration/integrations/browsersession.mdx index f5eb7c3e6a618..32438e6585383 100644 --- a/docs/platforms/javascript/common/configuration/integrations/browsersession.mdx +++ b/docs/platforms/javascript/common/configuration/integrations/browsersession.mdx @@ -40,11 +40,21 @@ Sentry.init({ ## Configuration Options - + Controls how long one session lasts and when a new session is started. -- `'route'`: A new session is started when the route changes, based on the [History API](https://developer.mozilla.org/en-US/docs/Web/API/History_API). This is the default behavior. If you're building a single-page application (SPA), this will result in one session being created per soft navigation. -- `'page'`: A new session is started when the page changes on a hard page reload or navigation. This is useful if you're building a single-page application (SPA) and want to track one session across multiple routes as users navigate through your application. +- `'page'`: Starts a session on page load. Client-side route changes keep the same session. This is the default. +- `'route'`: Starts a session on page load and on each navigation detected through the [History API](https://developer.mozilla.org/en-US/docs/Web/API/History_API). + +Before SDK version 11, the default was `'route'`. + +To create a session on each client-side navigation in a single-page application, set `lifecycle` to `'route'`: + +```javascript +Sentry.init({ + integrations: [Sentry.browserSessionIntegration({ lifecycle: "route" })], +}); +``` diff --git a/docs/platforms/javascript/common/configuration/integrations/fetchstreamperformance.mdx b/docs/platforms/javascript/common/configuration/integrations/fetchstreamperformance.mdx new file mode 100644 index 0000000000000..3e765883aaa79 --- /dev/null +++ b/docs/platforms/javascript/common/configuration/integrations/fetchstreamperformance.mdx @@ -0,0 +1,56 @@ +--- +title: FetchStreamPerformance +description: "Measure how long streamed fetch response bodies take to finish." +notSupported: + - javascript.cordova + - javascript.capacitor + - javascript.electron + - javascript.node + - javascript.aws-lambda + - javascript.azure-functions + - javascript.connect + - javascript.express + - javascript.fastify + - javascript.gcp-functions + - javascript.hapi + - javascript.hono + - javascript.koa + - javascript.nitro + - javascript.nestjs + - javascript.deno + - javascript.cloudflare + - javascript.bun + - javascript.effect + - javascript.elysia + - javascript.firebase + - javascript.mastra +--- + + + +This integration only works inside a browser environment. Requires JavaScript SDK version 11 or later. + + + +_Import name: `Sentry.fetchStreamPerformanceIntegration`_ + +The FetchStreamPerformance integration measures how long streamed fetch responses take to finish. It captures spans from when response headers arrive until the body finishes, up to 90 seconds. + +Use it with BrowserTracing or your framework's routing integration. + +```javascript +Sentry.init({ + integrations: [ + Sentry.browserTracingIntegration(), + Sentry.fetchStreamPerformanceIntegration(), + ], +}); +``` + +Responses are tracked when they have no `content-length` header and their `content-type` starts with one of these values: + +- `text/event-stream` +- `application/x-ndjson` +- `application/stream+json` + +This integration has no configuration options. diff --git a/docs/platforms/javascript/common/configuration/integrations/index.mdx b/docs/platforms/javascript/common/configuration/integrations/index.mdx index cfedf1d887d79..ea485185e3c5b 100644 --- a/docs/platforms/javascript/common/configuration/integrations/index.mdx +++ b/docs/platforms/javascript/common/configuration/integrations/index.mdx @@ -85,6 +85,8 @@ Lazy loading is available for the following integrations: - `reportingObserverIntegration` - `rewriteFramesIntegration` - `browserProfilingIntegration` +- `userTimingIntegration` +- `interactionsIntegration` diff --git a/docs/platforms/javascript/common/configuration/integrations/interactions.mdx b/docs/platforms/javascript/common/configuration/integrations/interactions.mdx new file mode 100644 index 0000000000000..24fe7b2269a36 --- /dev/null +++ b/docs/platforms/javascript/common/configuration/integrations/interactions.mdx @@ -0,0 +1,78 @@ +--- +title: Interactions +description: "Capture clicks and the work they trigger as browser spans." +notSupported: + - javascript.cordova + - javascript.capacitor + - javascript.electron + - javascript.node + - javascript.aws-lambda + - javascript.azure-functions + - javascript.connect + - javascript.express + - javascript.fastify + - javascript.gcp-functions + - javascript.hapi + - javascript.hono + - javascript.koa + - javascript.nitro + - javascript.nestjs + - javascript.deno + - javascript.cloudflare + - javascript.bun + - javascript.effect + - javascript.elysia + - javascript.firebase + - javascript.mastra +--- + + + +This integration only works inside a browser environment. Requires JavaScript SDK version 11 or later. + + + +_Import name: `Sentry.interactionsIntegration`_ + +The Interactions integration captures clicks and the work they trigger as spans. Use it with BrowserTracing or your framework's routing integration to associate interactions with the current route. + + + +This integration is experimental and can generate a large number of spans. + + + +```javascript +Sentry.init({ + integrations: [ + Sentry.browserTracingIntegration(), + Sentry.interactionsIntegration(), + ], +}); +``` + +Clicks outside an active pageload or navigation start an interaction span. Requests and other spans started during the interaction become its children. The integration also captures individual clicks. + +INP is collected by the WebVitals integration and does not require this integration. + +## Configuration Options + +These timeouts apply to interaction spans, independently of BrowserTracing's pageload and navigation timeouts. + + + +Time in milliseconds to wait before finishing an interaction span when no unfinished child spans remain. + + + + + +Maximum duration of an interaction span in milliseconds, including time spent waiting for child spans. + + + + + +Maximum time in milliseconds a child span can run before the interaction span finishes. + + diff --git a/docs/platforms/javascript/common/configuration/integrations/usertiming.mdx b/docs/platforms/javascript/common/configuration/integrations/usertiming.mdx new file mode 100644 index 0000000000000..d1131ff300dc1 --- /dev/null +++ b/docs/platforms/javascript/common/configuration/integrations/usertiming.mdx @@ -0,0 +1,62 @@ +--- +title: UserTiming +description: "Capture performance.mark() and performance.measure() entries as browser spans." +notSupported: + - javascript.cordova + - javascript.capacitor + - javascript.electron + - javascript.node + - javascript.aws-lambda + - javascript.azure-functions + - javascript.connect + - javascript.express + - javascript.fastify + - javascript.gcp-functions + - javascript.hapi + - javascript.hono + - javascript.koa + - javascript.nitro + - javascript.nestjs + - javascript.deno + - javascript.cloudflare + - javascript.bun + - javascript.effect + - javascript.elysia + - javascript.firebase + - javascript.mastra +--- + + + +This integration only works inside a browser environment. Requires JavaScript SDK version 11 or later. + + + +_Import name: `Sentry.userTimingIntegration`_ + +The UserTiming integration captures `performance.mark()` and `performance.measure()` entries as spans. Use it with BrowserTracing or your framework's routing integration. Timing entries are added to pageload and navigation spans when those spans end. + +Before SDK version 11, BrowserTracing captured these entries automatically, without a separate integration. + +```javascript +Sentry.init({ + integrations: [ + Sentry.browserTracingIntegration(), + Sentry.userTimingIntegration(), + ], +}); +``` + +## Configuration Options + + + +Skip timing entries whose names match any string or regular expression in this array. Use this to exclude measurements from third-party code. + +```javascript +Sentry.userTimingIntegration({ + ignore: ["third-party-mark", /^framework-/], +}); +``` + + diff --git a/docs/platforms/javascript/common/configuration/integrations/webvitals.mdx b/docs/platforms/javascript/common/configuration/integrations/webvitals.mdx new file mode 100644 index 0000000000000..6876e00145611 --- /dev/null +++ b/docs/platforms/javascript/common/configuration/integrations/webvitals.mdx @@ -0,0 +1,88 @@ +--- +title: WebVitals +description: "Configure browser Web Vitals collection, including INP, LCP, and CLS." +notSupported: + - javascript.cordova + - javascript.capacitor + - javascript.electron + - javascript.node + - javascript.aws-lambda + - javascript.azure-functions + - javascript.connect + - javascript.express + - javascript.fastify + - javascript.gcp-functions + - javascript.hapi + - javascript.hono + - javascript.koa + - javascript.nitro + - javascript.nestjs + - javascript.deno + - javascript.cloudflare + - javascript.bun + - javascript.effect + - javascript.elysia + - javascript.firebase + - javascript.mastra +--- + + + +This integration only works inside a browser environment. Requires JavaScript SDK version 10.57.0 or later. + + + +_Import name: `Sentry.webVitalsIntegration`_ + +The WebVitals integration captures LCP, CLS, and INP for the [Web Vitals dashboard](/product/dashboards/sentry-dashboards/frontend/web-vitals/). + + + BrowserTracing + +adds this integration automatically. In SDK version 11 and later, configure it through BrowserTracing's +`webVitals` option: + +```javascript +Sentry.init({ + integrations: [ + Sentry.browserTracingIntegration({ + webVitals: { + ignore: ["inp"], + }, + }), + ], +}); +``` + +To configure it in SDK versions before 11, add `Sentry.webVitalsIntegration({ ... })` directly to `integrations`: + +```javascript +Sentry.init({ + integrations: [ + Sentry.browserTracingIntegration(), + Sentry.webVitalsIntegration({ ignore: ["inp"] }), + ], +}); +``` + +You can also use this approach in SDK version 11 and later. An explicitly added WebVitals integration takes precedence over BrowserTracing's Web Vitals settings. + +## Configuration Options + + + +Web Vitals to skip. By default, all supported Web Vitals are collected. + + + + + +Collect LCP, CLS, and INP for each soft navigation detected by the browser's Soft Navigations API. Requires stream mode and a browser that supports this API. Set to `false` to collect one set of vitals for the page lifetime. + + + + + +Collect LCP, CLS, and INP when a page is restored from the back/forward cache. Requires stream mode and BrowserTracing with `instrumentBfcacheRestore` enabled. Set to `false` to disable Web Vitals collection for restores. + + diff --git a/docs/platforms/javascript/common/install/loader.mdx b/docs/platforms/javascript/common/install/loader.mdx index 91de29e976014..e8303f2ffc1c0 100644 --- a/docs/platforms/javascript/common/install/loader.mdx +++ b/docs/platforms/javascript/common/install/loader.mdx @@ -416,7 +416,7 @@ Our CDN hosts a variety of bundles: - `bundle.tracing.replay.logs.metrics..js` - Error monitoring, tracing, session replay, logs, and metrics - `bundle.tracing.replay.feedback.logs.metrics..js` - Error monitoring, tracing, session replay, feedback, logs, and metrics -Additionally, each of the integrations in `@sentry/integrations` is available as a bundle named `..js`. +Some integrations are available as separate bundles. See Lazy Loading Integrations for the supported list. Since v8 of the SDK, the bundles are ES6 by default. If you need ES5 support, make sure to add a polyfill for ES5 features yourself. Alternatively, you can use the v7 bundles and add the `.es5` modifier. diff --git a/docs/platforms/javascript/common/migration/v10-to-v11/index.mdx b/docs/platforms/javascript/common/migration/v10-to-v11/index.mdx index 83aa7dbabd85a..a75ec94005386 100644 --- a/docs/platforms/javascript/common/migration/v10-to-v11/index.mdx +++ b/docs/platforms/javascript/common/migration/v10-to-v11/index.mdx @@ -866,6 +866,8 @@ Sentry.init({ }); ``` +See BrowserSession for lifecycle configuration and session health details. + ### The `DOMException.code` Tag Was Removed Events created from a `DOMException` no longer carry a `DOMException.code` tag, because the `code` property is deprecated in favor of `DOMException.name`, which is already the exception type. Switch searches and alert rules that use the tag to `error.type`. @@ -897,10 +899,10 @@ Several `browserTracingIntegration` options moved to dedicated integrations, or | Removed option | Replacement | | ------------------------------------- | ----------------------------------------------- | -| `_experiments.enableInteractions` | `interactionsIntegration()` | -| `ignorePerformanceApiSpans` | `userTimingIntegration({ ignore: [...] })` | -| `trackFetchStreamPerformance` | `fetchStreamPerformanceIntegration()` | -| `_experiments.enableStandalone*Spans` | Removed, CLS and LCP are no longer configurable | +| `_experiments.enableInteractions` | `interactionsIntegration()` | +| `ignorePerformanceApiSpans` | `userTimingIntegration({ ignore: [...] })` | +| `trackFetchStreamPerformance` | `fetchStreamPerformanceIntegration()` | +| `_experiments.enableStandalone*Spans` | Removed. The trace lifecycle determines how CLS and LCP are sent. | ```js // Before @@ -925,12 +927,16 @@ Sentry.init({ }); ``` -`browserTracingIntegration` no longer captures `performance.mark()` and `performance.measure()` spans by default, and no longer accepts an `_experiments` object at all. The `idleTimeout`, `finalTimeout`, and `childSpanTimeout` options of interaction spans are configured on `interactionsIntegration` now, with the same defaults as before. +`browserTracingIntegration` no longer captures `performance.mark()` and `performance.measure()` spans by default, and no longer accepts an `_experiments` object. Configure `idleTimeout`, `finalTimeout`, and `childSpanTimeout` for interaction spans on `interactionsIntegration`, with the same defaults as before. BrowserTracing's timeout options still control pageload and navigation spans. -Web vitals also changed: +BrowserTracing now automatically adds the WebVitals integration. Web Vitals changed as follows: - CLS and LCP are recorded as measurements on the pageload span, or as dedicated spans in stream mode. -- INP is always sent as a web vital span, carrying its value in the `browser.web_vital.inp.value` attribute instead of as a span measurement. Update custom dashboards and alerts that read it as a measurement (built-in dashboards do not need adjustments). +- When collected, INP is always sent as a Web Vital span, carrying its value in the `browser.web_vital.inp.value` attribute instead of as a span measurement. Update custom dashboards and alerts that read it as a measurement. Built-in dashboards do not need adjustments. +- The `enableInp` option is deprecated. To disable INP, use `browserTracingIntegration({ webVitals: { ignore: ["inp"] } })`. The `ignore` array can also contain `"cls"` or `"lcp"` to skip those vitals. +- To configure Web Vitals, pass `webVitals` options to BrowserTracing, or add `webVitalsIntegration()` explicitly. Explicit registration takes precedence over BrowserTracing's `webVitals` and `enableInp` options. +- Soft-navigation vitals are enabled by default in stream mode on browsers that support the Soft Navigations API. Set `webVitals: { softNavigations: false }` to keep one set of vitals for the page lifetime. +- BrowserTracing starts a navigation span after a back/forward-cache restore by default. Set `instrumentBfcacheRestore: false` to disable it. Web Vitals for restores are collected by default in stream mode when `instrumentBfcacheRestore` is enabled. Set `webVitals: { bfcacheNavigations: false }` to disable this collection. diff --git a/docs/platforms/javascript/common/tracing/instrumentation/automatic-instrumentation.mdx b/docs/platforms/javascript/common/tracing/instrumentation/automatic-instrumentation.mdx index 1ed43c3321d85..d1d6d46ae49b3 100644 --- a/docs/platforms/javascript/common/tracing/instrumentation/automatic-instrumentation.mdx +++ b/docs/platforms/javascript/common/tracing/instrumentation/automatic-instrumentation.mdx @@ -29,7 +29,7 @@ Once you enable tracing, the SDK automatically captures performance data without | **Page loads** | Full page load performance | LCP, CLS, TTFB | | **Navigations** | Client-side route changes | Duration, Web Vitals | | **HTTP requests** | All fetch/XHR calls | Duration, status, URL | -| **User interactions** | Clicks, inputs that trigger work | INP (responsiveness) | +| **Responsiveness** | Interaction to Next Paint | INP | | **Long tasks** | Main thread blocking > 50ms | Duration, attribution | @@ -118,36 +118,56 @@ Exclude requests from tracing, such as health checks or analytics pings: -## Web Vitals & Interactions - -### Interaction to Next Paint (INP) + - + -Automatically captures [INP](/product/dashboards/sentry-dashboards/frontend/web-vitals/web-vitals-concepts/#interaction-to-next-paint-inp) events to measure responsiveness. Results appear in the [Web Vitals](/product/dashboards/sentry-dashboards/frontend/web-vitals/) module. +## Web Vitals & Interactions -Default: `true` in SDK 8.x+, `false` in 7.x. +BrowserTracing automatically captures Web Vitals. To capture clicks and the work they trigger as spans, add the Interactions integration. - +### Configure Web Vitals -As of SDK version 10.0.0, First Input Delay (FID) is no longer reported. Google deprecated FID in favor of INP, which provides a more comprehensive measure of responsiveness. If you have alerts or dashboards based on FID, update them to use INP instead. + - +Configure which Web Vitals BrowserTracing collects. For example, to disable INP collection: +If you explicitly add `webVitalsIntegration()`, configure these options on that integration instead. See WebVitals for details and browser support requirements. + - +### Interaction to Next Paint (INP) + +BrowserTracing automatically captures [INP](/product/dashboards/sentry-dashboards/frontend/web-vitals/web-vitals-concepts/#interaction-to-next-paint-inp) to measure responsiveness. Results appear in the [Web Vitals](/product/dashboards/sentry-dashboards/frontend/web-vitals/) module. -Sample rate for INP spans, applied on top of `tracesSampleRate`. For example, `interactionsSampleRate: 0.5` with `tracesSampleRate: 0.1` results in 5% of interactions captured. + + +Enable or disable INP collection. Defaults to `true` in SDK 8 and later, and `false` in SDK 7.x. + +Deprecated in SDK version 11. Use `webVitals: { ignore: ["inp"] }` to disable INP. Explicitly adding `webVitalsIntegration()` takes precedence over this option. + + + + ## Advanced Options +These timeouts control pageload and navigation spans. + + + + +Configure timeouts for click-triggered work on the Interactions integration separately. + + + + Time in ms to wait before finishing a pageload/navigation span when no unfinished child spans remain. @@ -182,6 +202,20 @@ Enable/disable automatic `navigation` span creation on history changes. + + + + + +Start a navigation span when the page is restored from the back/forward cache. This starts a new trace for activity after the restore. It is independent of `instrumentNavigation`. + +Web Vitals for restored pages are collected by default in stream mode. Set `webVitals: { bfcacheNavigations: false }` to disable this collection. See WebVitals for requirements. + + + + + + Enable/disable automatic spans for long tasks (main thread blocking > 50ms). @@ -250,21 +284,24 @@ Sentry.init({ - + + -Ignore spans created from `performance.mark()` and `performance.measure()`: +Use the UserTiming integration to capture `performance.mark()` and `performance.measure()` entries. To ignore entries by name: ```javascript Sentry.init({ integrations: [ - Sentry.browserTracingIntegration({ - ignorePerformanceApiSpans: ["myMeasurement", /myMark/], + Sentry.browserTracingIntegration(), + Sentry.userTimingIntegration({ + ignore: ["myMeasurement", /myMark/], }), ], }); ``` - + + diff --git a/docs/platforms/javascript/guides/nextjs/tracing/index.mdx b/docs/platforms/javascript/guides/nextjs/tracing/index.mdx index 802c9ced62d90..69e895b9905bf 100644 --- a/docs/platforms/javascript/guides/nextjs/tracing/index.mdx +++ b/docs/platforms/javascript/guides/nextjs/tracing/index.mdx @@ -185,7 +185,7 @@ export async function submitForm(formData: FormData) { ## Web Vitals -The SDK automatically captures [Web Vitals](/product/dashboards/sentry-dashboards/frontend/web-vitals/) on every page load. These metrics measure real user experience: +The SDK automatically captures [Web Vitals](/product/dashboards/sentry-dashboards/frontend/web-vitals/) in the browser. These metrics measure real user experience: | Metric | What It Measures | Threshold (Good) | |--------|------------------|------------------| @@ -195,7 +195,9 @@ The SDK automatically captures [Web Vitals](/product/dashboards/sentry-dashboard | **FCP** | First Contentful Paint — initial render | ≤ 1s | | **TTFB** | Time to First Byte — server response | ≤ 100ms | -Web Vitals appear as measurements on page load transactions and feed into your [Performance Score](/product/dashboards/sentry-dashboards/frontend/web-vitals/#performance-score). See [Web Vitals Concepts](/product/dashboards/sentry-dashboards/frontend/web-vitals/web-vitals-concepts/) for detailed explanations of each metric. +Web Vitals feed into your [Performance Score](/product/dashboards/sentry-dashboards/frontend/web-vitals/#performance-score). In the default stream mode, LCP, CLS, and INP are sent as Web Vital spans. + +To configure collection, see the WebVitals integration. For metric definitions and differences between SDK versions, see [Web Vitals Concepts](/product/dashboards/sentry-dashboards/frontend/web-vitals/web-vitals-concepts/). ## Custom Instrumentation diff --git a/docs/product/dashboards/sentry-dashboards/frontend/web-vitals/web-vitals-concepts.mdx b/docs/product/dashboards/sentry-dashboards/frontend/web-vitals/web-vitals-concepts.mdx index a31ad37e5ed37..242fec95080cf 100644 --- a/docs/product/dashboards/sentry-dashboards/frontend/web-vitals/web-vitals-concepts.mdx +++ b/docs/product/dashboards/sentry-dashboards/frontend/web-vitals/web-vitals-concepts.mdx @@ -9,7 +9,11 @@ og_image: /og-images/product-insights-frontend-web-vitals-web-vitals-concepts.pn [Web Vitals](https://web.dev/vitals/) are a set of metrics defined by Google to measure render time, response time, and layout shift. Each data point provides insights about the overall [performance](/product/dashboards/sentry-dashboards/) of your application. -The in-browser Sentry SDKs collect web vitals information (where supported) and adds that information to frontend [transactions](/product/dashboards/sentry-dashboards/transaction-summary/). These web vitals are then summarized in the [Web Vitals dashboard](/product/dashboards/sentry-dashboards/frontend/web-vitals/) to give you a quick overview of how each page is performing for your users. +Sentry's browser SDKs collect supported Web Vitals and associate them with your application's traces. The [Web Vitals dashboard](/product/dashboards/sentry-dashboards/frontend/web-vitals/) summarizes these metrics to show how each page performs for your users. + +In JavaScript SDK version 11's default stream mode, LCP, CLS, and INP are sent as Web Vital spans. Earlier SDK versions and static mode can report vitals as measurements on pageload spans. In version 11, INP uses a Web Vital span in both modes. + +To configure collection, see the [WebVitals integration](/platforms/javascript/configuration/integrations/webvitals/). If your custom dashboards or alerts use INP measurements, see the [v11 migration guide](/platforms/javascript/migration/v10-to-v11/). ![Visualization of Web Vitals](../../img/diagram-transaction-vitals.png) @@ -24,7 +28,7 @@ Google considers Core Web Vitals to be the most important metrics for measuring ### Interaction to Next Paint (INP) -On March 12, 2024, Interaction to Next Paint (INP) replaced First Input Delay (FID) as a Core Web Vital. Prior to this, INP was an experimental metric that Sentry did not collect. To begin collecting INP measurements, make sure your JavaScript SDK version is [7.104.0](https://github.com/getsentry/sentry-javascript/releases/tag/7.104.0) or higher and that the option [`enableInp`](/platforms/javascript/tracing/instrumentation/automatic-instrumentation/#enableinp) is on (starting with version `8.0.0`, `enableInp` is enabled by default). +INP replaced First Input Delay (FID) as a Core Web Vital on March 12, 2024. Sentry supports INP starting with JavaScript SDK version 7.104.0. It is enabled by default with BrowserTracing in version 8 and later. In version 11, configure collection through the [WebVitals integration](/platforms/javascript/configuration/integrations/webvitals/). The older `enableInp` option is deprecated. [Interaction to Next Paint (INP)](https://web.dev/articles/inp) measures the time from when a user interacts with a page (through a click, tap, or keyboard input) to when the next paint (rendering of content on the screen) occurs. INP aims to assess how quickly users see a response from the website after taking an action, which is crucial for providing a smooth and responsive user experience. diff --git a/includes/migration/javascript-v11/browser-session-lifecycle-page.mdx b/includes/migration/javascript-v11/browser-session-lifecycle-page.mdx index 8da8a9aecd729..0545f0a4f3b2d 100644 --- a/includes/migration/javascript-v11/browser-session-lifecycle-page.mdx +++ b/includes/migration/javascript-v11/browser-session-lifecycle-page.mdx @@ -17,3 +17,5 @@ Sentry.init({ integrations: [Sentry.browserSessionIntegration({ lifecycle: "route" })], }); ``` + +See BrowserSession for lifecycle configuration and session health details. diff --git a/includes/migration/javascript-v11/browser-session-unhandled.mdx b/includes/migration/javascript-v11/browser-session-unhandled.mdx index 1827622d318bb..5ff4021d42066 100644 --- a/includes/migration/javascript-v11/browser-session-unhandled.mdx +++ b/includes/migration/javascript-v11/browser-session-unhandled.mdx @@ -10,3 +10,5 @@ order: 20 --- Sessions affected by an uncaught error are recorded as `unhandled` instead of `crashed`. If you track crash-free session rates or have alerts built on them, expect the rate to shift. + +See BrowserSession for session health details. diff --git a/includes/migration/javascript-v11/browser-user-timing.mdx b/includes/migration/javascript-v11/browser-user-timing.mdx index 45106aad2700e..6897a55acc1b9 100644 --- a/includes/migration/javascript-v11/browser-user-timing.mdx +++ b/includes/migration/javascript-v11/browser-user-timing.mdx @@ -29,3 +29,5 @@ Sentry.init({ ], }); ``` + +See UserTiming for configuration and CDN loading instructions. diff --git a/includes/migration/javascript-v11/browser-web-vital-options.mdx b/includes/migration/javascript-v11/browser-web-vital-options.mdx index f7b759a6e913a..2f4e48b7aaf20 100644 --- a/includes/migration/javascript-v11/browser-web-vital-options.mdx +++ b/includes/migration/javascript-v11/browser-web-vital-options.mdx @@ -1,6 +1,6 @@ --- id: browser-web-vital-options -title: "Standalone CLS and LCP span options were removed" +title: "Web Vitals moved to a dedicated integration" phase: code-changes category: removed-api severity: action-required @@ -9,6 +9,10 @@ platformCategory: browser order: 220 --- -The `_experiments.enableStandalone*Spans` options were removed. CLS and LCP are no longer configurable, and `browserTracingIntegration` no longer accepts an `_experiments` object at all. +The `_experiments.enableStandalone*Spans` options were removed, and `browserTracingIntegration` no longer accepts an `_experiments` object. BrowserTracing automatically adds `webVitalsIntegration` to collect Web Vitals. CLS and LCP are recorded as measurements on the pageload span, or as dedicated spans in stream mode. + +Configure collection through `browserTracingIntegration({ webVitals: { ... } })`. The `enableInp` option is deprecated. Use `webVitals: { ignore: ["inp"] }` to disable INP, or include `"cls"` or `"lcp"` in `ignore` to skip those vitals. If you explicitly add `webVitalsIntegration()`, its options take precedence. + +Soft-navigation vitals are enabled by default in stream mode on supporting browsers. Set `webVitals: { softNavigations: false }` to keep one set of vitals for the page lifetime. Back/forward-cache vitals are also enabled by default in stream mode when BrowserTracing's `instrumentBfcacheRestore` is enabled. Set `webVitals: { bfcacheNavigations: false }` to disable collection for restores. See WebVitals for requirements. diff --git a/includes/migration/javascript-v11/inp-web-vital-span.mdx b/includes/migration/javascript-v11/inp-web-vital-span.mdx index 5e1eaaabe848e..b46f2b2b6d09c 100644 --- a/includes/migration/javascript-v11/inp-web-vital-span.mdx +++ b/includes/migration/javascript-v11/inp-web-vital-span.mdx @@ -9,4 +9,6 @@ platformCategory: browser order: 80 --- -INP is always sent as a web vital span, carrying its value in the `browser.web_vital.inp.value` attribute instead of as a span measurement. Update custom dashboards and alerts that read it as a measurement (built-in dashboards do not need adjustments). +When collected, INP is always sent as a Web Vital span, carrying its value in the `browser.web_vital.inp.value` attribute instead of as a span measurement. Update custom dashboards and alerts that read it as a measurement. Built-in dashboards do not need adjustments. + +See WebVitals for collection options and the attributes sent with each vital. diff --git a/includes/migration/javascript-v11/interaction-spans-integration.mdx b/includes/migration/javascript-v11/interaction-spans-integration.mdx index 2abf543870bde..2f814c16d7901 100644 --- a/includes/migration/javascript-v11/interaction-spans-integration.mdx +++ b/includes/migration/javascript-v11/interaction-spans-integration.mdx @@ -30,4 +30,4 @@ Sentry.init({ }); ``` -The `idleTimeout`, `finalTimeout`, and `childSpanTimeout` options of interaction spans are configured on `interactionsIntegration` now, with the same defaults as before. +Configure `idleTimeout`, `finalTimeout`, and `childSpanTimeout` for interaction spans on `interactionsIntegration`, with the same defaults as before. BrowserTracing's timeout options still control pageload and navigation spans. See Interactions for configuration and CDN loading instructions. diff --git a/includes/migration/javascript-v11/track-fetch-stream-performance.mdx b/includes/migration/javascript-v11/track-fetch-stream-performance.mdx index c2dd1eedf5538..167aecfba86c8 100644 --- a/includes/migration/javascript-v11/track-fetch-stream-performance.mdx +++ b/includes/migration/javascript-v11/track-fetch-stream-performance.mdx @@ -29,3 +29,5 @@ Sentry.init({ ], }); ``` + +See FetchStreamPerformance for supported response types and setup instructions. diff --git a/platform-includes/configuration/auto-session-tracking/javascript.mdx b/platform-includes/configuration/auto-session-tracking/javascript.mdx index 253272c211408..11fefd4cbc5a4 100644 --- a/platform-includes/configuration/auto-session-tracking/javascript.mdx +++ b/platform-includes/configuration/auto-session-tracking/javascript.mdx @@ -1,7 +1,8 @@ -By default, the JavaScript Browser SDKs are sending sessions. -We create a session for every page load. For single-page applications, we will create a new session for every navigation change (History API). +JavaScript Browser SDKs track sessions by default. A session starts on page load and continues across client-side navigations. A hard reload or navigation starts a new session. + +Before SDK version 11, the SDK started a new session on each client-side navigation by default. To configure this behavior, see BrowserSession lifecycle. To disable the default sessions handling, disable the `BrowserSession` integration: @@ -37,7 +38,18 @@ Sentry.init({ Sessions are marked as: -- `crashed` if an _unhandled error_ or _unhandled promise rejection_ bubbled up to the global handler. + + +- `unhandled` in the browser if an _unhandled error_ or _unhandled promise rejection_ bubbles up to the global handler. Before SDK version 11, browser sessions used `crashed` for these errors. + + + + + +- `crashed` on the server if an _unhandled error_ or _unhandled promise rejection_ bubbles up to the global handler. + + + - `errored` if the SDK captures an event that contains an exception (this includes manually captured errors). To receive data on user adoption, such as users crash free rate percentage, and the number of users that have adopted a specific release, set the user on the [`initialScope`](/platforms/javascript/configuration/options/#initial-scope) when initializing the SDK. diff --git a/platform-includes/configuration/integrations/javascript.astro.mdx b/platform-includes/configuration/integrations/javascript.astro.mdx index 5d44264f8c76d..a5eb483d43f1d 100644 --- a/platform-includes/configuration/integrations/javascript.astro.mdx +++ b/platform-includes/configuration/integrations/javascript.astro.mdx @@ -26,6 +26,10 @@ Depending on whether an integration enhances the functionality of a particular r | [`browserApiErrorsIntegration`](./browserapierrors) | ✓ | ✓ | | | | | [`browserSessionIntegration`](./browsersession) | ✓ | | | | ✓ | | [`browserTracingIntegration`](./browsertracing) | ✓ | | ✓ | | ✓ | +| [`fetchStreamPerformanceIntegration`](./fetchstreamperformance) | | | ✓ | | | +| [`interactionsIntegration`](./interactions) | | | ✓ | | | +| [`userTimingIntegration`](./usertiming) | | | ✓ | | | +| [`webVitalsIntegration`](./webvitals) | With BrowserTracing | | ✓ | | | | [`globalHandlersIntegration`](./globalhandlers) | ✓ | ✓ | | | | | [`httpContextIntegration`](./httpcontext) | ✓ | | | | ✓ | | [`browserProfilingIntegration`](./browserprofiling) | | | ✓ | | | diff --git a/platform-includes/configuration/integrations/javascript.gatsby.mdx b/platform-includes/configuration/integrations/javascript.gatsby.mdx index 5aff5b73147a2..bf11cd5d8784b 100644 --- a/platform-includes/configuration/integrations/javascript.gatsby.mdx +++ b/platform-includes/configuration/integrations/javascript.gatsby.mdx @@ -13,6 +13,10 @@ | [`browserProfilingIntegration`](./browserprofiling) | | | ✓ | | | | [`browserSessionIntegration`](./browsersession) | ✓ | | | | ✓ | | [`browserTracingIntegration`](./browsertracing) | | | ✓ | | ✓ | +| [`fetchStreamPerformanceIntegration`](./fetchstreamperformance) | | | ✓ | | | +| [`interactionsIntegration`](./interactions) | | | ✓ | | | +| [`userTimingIntegration`](./usertiming) | | | ✓ | | | +| [`webVitalsIntegration`](./webvitals) | With BrowserTracing | | ✓ | | | | [`captureConsoleIntegration`](./captureconsole) | | | | | ✓ | | [`contextLinesIntegration`](./contextlines) | | ✓ | | | | | [`extraErrorDataIntegration`](./extraerrordata) | | | | | ✓ | diff --git a/platform-includes/configuration/integrations/javascript.mdx b/platform-includes/configuration/integrations/javascript.mdx index 3061f61c3fe67..fb44858ee5d82 100644 --- a/platform-includes/configuration/integrations/javascript.mdx +++ b/platform-includes/configuration/integrations/javascript.mdx @@ -14,6 +14,10 @@ | [`anthropicAIIntegration`](../../agent-tracing/anthropic) | | | ✓ | | ✓ | | [`browserProfilingIntegration`](./browserprofiling) | | | ✓ | | | | [`browserTracingIntegration`](./browsertracing) | | | ✓ | | ✓ | +| [`fetchStreamPerformanceIntegration`](./fetchstreamperformance) | | | ✓ | | | +| [`interactionsIntegration`](./interactions) | | | ✓ | | | +| [`userTimingIntegration`](./usertiming) | | | ✓ | | | +| [`webVitalsIntegration`](./webvitals) | With BrowserTracing | | ✓ | | | | [`elementTimingIntegration`](./elementtiming) | | | | | | | [`captureConsoleIntegration`](./captureconsole) | | ✓ | | | ✓ | | [`contextLinesIntegration`](./contextlines) | | ✓ | | | | diff --git a/platform-includes/configuration/integrations/javascript.nextjs.mdx b/platform-includes/configuration/integrations/javascript.nextjs.mdx index 58b03e0ad63ff..b80523d496b3a 100644 --- a/platform-includes/configuration/integrations/javascript.nextjs.mdx +++ b/platform-includes/configuration/integrations/javascript.nextjs.mdx @@ -27,6 +27,10 @@ Depending on whether an integration enhances the functionality of a particular r | [`browserApiErrorsIntegration`](./browserapierrors) | ✓ | ✓ | | | | | [`browserSessionIntegration`](./browsersession) | ✓ | | | | ✓ | | [`browserTracingIntegration`](./browsertracing) | ✓ | | ✓ | | ✓ | +| [`fetchStreamPerformanceIntegration`](./fetchstreamperformance) | | | ✓ | | | +| [`interactionsIntegration`](./interactions) | | | ✓ | | | +| [`userTimingIntegration`](./usertiming) | | | ✓ | | | +| [`webVitalsIntegration`](./webvitals) | With BrowserTracing | | ✓ | | | | [`globalHandlersIntegration`](./globalhandlers) | ✓ | ✓ | | | | | [`httpContextIntegration`](./httpcontext) | ✓ | | | | ✓ | | [`browserProfilingIntegration`](./browserprofiling) | | | ✓ | | | diff --git a/platform-includes/configuration/integrations/javascript.nuxt.mdx b/platform-includes/configuration/integrations/javascript.nuxt.mdx index 299722eb63186..3af9b312da31e 100644 --- a/platform-includes/configuration/integrations/javascript.nuxt.mdx +++ b/platform-includes/configuration/integrations/javascript.nuxt.mdx @@ -26,6 +26,10 @@ Depending on whether an integration enhances the functionality of a particular r | [`browserApiErrorsIntegration`](./browserapierrors) | ✓ | ✓ | | | | | [`browserSessionIntegration`](./browsersession) | ✓ | | | | ✓ | | [`browserTracingIntegration`](./browsertracing) | ✓ | | ✓ | | ✓ | +| [`fetchStreamPerformanceIntegration`](./fetchstreamperformance) | | | ✓ | | | +| [`interactionsIntegration`](./interactions) | | | ✓ | | | +| [`userTimingIntegration`](./usertiming) | | | ✓ | | | +| [`webVitalsIntegration`](./webvitals) | With BrowserTracing | | ✓ | | | | [`globalHandlersIntegration`](./globalhandlers) | ✓ | ✓ | | | | | [`httpContextIntegration`](./httpcontext) | ✓ | | | | ✓ | | [`browserProfilingIntegration`](./browserprofiling) | | | ✓ | | | diff --git a/platform-includes/configuration/integrations/javascript.remix.mdx b/platform-includes/configuration/integrations/javascript.remix.mdx index b7e2d2dc2a8ab..9d6c7c4c4e047 100644 --- a/platform-includes/configuration/integrations/javascript.remix.mdx +++ b/platform-includes/configuration/integrations/javascript.remix.mdx @@ -26,6 +26,10 @@ Depending on whether an integration enhances the functionality of a particular r | [`browserApiErrorsIntegration`](./browserapierrors) | ✓ | ✓ | | | | | [`browserSessionIntegration`](./browsersession) | ✓ | | | | ✓ | | [`browserTracingIntegration`](./browsertracing) | ✓ | | ✓ | | ✓ | +| [`fetchStreamPerformanceIntegration`](./fetchstreamperformance) | | | ✓ | | | +| [`interactionsIntegration`](./interactions) | | | ✓ | | | +| [`userTimingIntegration`](./usertiming) | | | ✓ | | | +| [`webVitalsIntegration`](./webvitals) | With BrowserTracing | | ✓ | | | | [`globalHandlersIntegration`](./globalhandlers) | ✓ | ✓ | | | | | [`httpContextIntegration`](./httpcontext) | ✓ | | | | ✓ | | [`browserProfilingIntegration`](./browserprofiling) | | | ✓ | | | diff --git a/platform-includes/configuration/integrations/javascript.solidstart.mdx b/platform-includes/configuration/integrations/javascript.solidstart.mdx index a33bc442497a4..873715155f310 100644 --- a/platform-includes/configuration/integrations/javascript.solidstart.mdx +++ b/platform-includes/configuration/integrations/javascript.solidstart.mdx @@ -26,6 +26,10 @@ Depending on whether an integration enhances the functionality of a particular r | [`browserApiErrorsIntegration`](./browserapierrors) | ✓ | ✓ | | | | | [`browserSessionIntegration`](./browsersession) | ✓ | | | | ✓ | | [`browserTracingIntegration`](./browsertracing) | ✓ | | ✓ | | ✓ | +| [`fetchStreamPerformanceIntegration`](./fetchstreamperformance) | | | ✓ | | | +| [`interactionsIntegration`](./interactions) | | | ✓ | | | +| [`userTimingIntegration`](./usertiming) | | | ✓ | | | +| [`webVitalsIntegration`](./webvitals) | With BrowserTracing | | ✓ | | | | [`globalHandlersIntegration`](./globalhandlers) | ✓ | ✓ | | | | | [`httpContextIntegration`](./httpcontext) | ✓ | | | | ✓ | | [`browserProfilingIntegration`](./browserprofiling) | | | ✓ | | | diff --git a/platform-includes/configuration/integrations/javascript.sveltekit.mdx b/platform-includes/configuration/integrations/javascript.sveltekit.mdx index 5f9b60c65be93..9028f20758da0 100644 --- a/platform-includes/configuration/integrations/javascript.sveltekit.mdx +++ b/platform-includes/configuration/integrations/javascript.sveltekit.mdx @@ -26,6 +26,10 @@ Depending on whether an integration enhances the functionality of a particular r | [`browserApiErrorsIntegration`](./browserapierrors) | ✓ | ✓ | | | | | [`browserSessionIntegration`](./browsersession) | ✓ | | | | ✓ | | [`browserTracingIntegration`](./browsertracing) | ✓ | | ✓ | | ✓ | +| [`fetchStreamPerformanceIntegration`](./fetchstreamperformance) | | | ✓ | | | +| [`interactionsIntegration`](./interactions) | | | ✓ | | | +| [`userTimingIntegration`](./usertiming) | | | ✓ | | | +| [`webVitalsIntegration`](./webvitals) | With BrowserTracing | | ✓ | | | | [`globalHandlersIntegration`](./globalhandlers) | ✓ | ✓ | | | | | [`httpContextIntegration`](./httpcontext) | ✓ | | | | ✓ | | [`browserProfilingIntegration`](./browserprofiling) | | | ✓ | | | diff --git a/platform-includes/configuration/integrations/javascript.vue.mdx b/platform-includes/configuration/integrations/javascript.vue.mdx index ecbd989aa0f01..ee901f3067045 100644 --- a/platform-includes/configuration/integrations/javascript.vue.mdx +++ b/platform-includes/configuration/integrations/javascript.vue.mdx @@ -14,6 +14,10 @@ | [`vueIntegration`](./vue) | ✓ | ✓ | ✓ | | | | [`browserProfilingIntegration`](./browserprofiling) | | | ✓ | | | | [`browserTracingIntegration`](./browsertracing) | | | ✓ | | ✓ | +| [`fetchStreamPerformanceIntegration`](./fetchstreamperformance) | | | ✓ | | | +| [`interactionsIntegration`](./interactions) | | | ✓ | | | +| [`userTimingIntegration`](./usertiming) | | | ✓ | | | +| [`webVitalsIntegration`](./webvitals) | With BrowserTracing | | ✓ | | | | [`captureConsoleIntegration`](./captureconsole) | | | | | ✓ | | [`contextLinesIntegration`](./contextlines) | | ✓ | | | | | [`extraErrorDataIntegration`](./extraerrordata) | | | | | ✓ | diff --git a/platform-includes/configuration/integrations/javascript.wasm.mdx b/platform-includes/configuration/integrations/javascript.wasm.mdx index ac3c8c7eab56d..b1c80277cfc54 100644 --- a/platform-includes/configuration/integrations/javascript.wasm.mdx +++ b/platform-includes/configuration/integrations/javascript.wasm.mdx @@ -13,6 +13,10 @@ | [`browserProfilingIntegration`](./browserprofiling) | | | ✓ | | | | [`browserSessionIntegration`](./browsersession) | ✓ | | | | ✓ | | [`browserTracingIntegration`](./browsertracing) | | | ✓ | | ✓ | +| [`fetchStreamPerformanceIntegration`](./fetchstreamperformance) | | | ✓ | | | +| [`interactionsIntegration`](./interactions) | | | ✓ | | | +| [`userTimingIntegration`](./usertiming) | | | ✓ | | | +| [`webVitalsIntegration`](./webvitals) | With BrowserTracing | | ✓ | | | | [`captureConsoleIntegration`](./captureconsole) | | | | | ✓ | | [`contextLinesIntegration`](./contextlines) | | ✓ | | | | | [`extraErrorDataIntegration`](./extraerrordata) | | | | | ✓ | diff --git a/platform-includes/performance/enable-inp-example/javascript.mdx b/platform-includes/performance/enable-inp-example/javascript.mdx index 9182861cab98e..7c64af2750285 100644 --- a/platform-includes/performance/enable-inp-example/javascript.mdx +++ b/platform-includes/performance/enable-inp-example/javascript.mdx @@ -3,7 +3,9 @@ Sentry.init({ // ... integrations: [ Sentry.browserTracingIntegration({ - enableInp: true, + webVitals: { + ignore: ["inp"], + }, }), ], });