From 43f6b9d65d3af7174d9e8e3bb25a4bbeedbcd98d Mon Sep 17 00:00:00 2001 From: edwardgou-sentry <83961295+edwardgou-sentry@users.noreply.github.com> Date: Mon, 11 Mar 2024 16:48:23 -0400 Subject: [PATCH] feat(webvitals): Adds docs for enableInp option (#9412) * update docs for INP * updated webvitals product content to give more clarity around score calculations for pageloads and interactions * cleaned up webvital browser support note a little * Add links to 7.105.0 version sdk * Emphasize dynamic weights and browser support in perf score calculation * update 7.105.0 to 7.104.0 * fix link * adds enable inp option doc * code sample * feedback fixes --- .../instrumentation/automatic-instrumentation.mdx | 13 +++++++++++++ docs/product/performance/web-vitals/index.mdx | 2 +- .../performance/web-vitals/web-vitals-concepts.mdx | 4 ++-- .../performance/enable-inp-example/javascript.mdx | 10 ++++++++++ 4 files changed, 26 insertions(+), 3 deletions(-) create mode 100644 platform-includes/performance/enable-inp-example/javascript.mdx diff --git a/docs/platforms/javascript/common/performance/instrumentation/automatic-instrumentation.mdx b/docs/platforms/javascript/common/performance/instrumentation/automatic-instrumentation.mdx index 7e84e43ca8474..778b998676f43 100644 --- a/docs/platforms/javascript/common/performance/instrumentation/automatic-instrumentation.mdx +++ b/docs/platforms/javascript/common/performance/instrumentation/automatic-instrumentation.mdx @@ -130,3 +130,16 @@ The default is `true`. This option determines whether spans for long tasks automatically get created. The default is `true`. + + +### enableInp + + +The `enableInp` option requires SDK [version 7.104.0](https://github.com/getsentry/sentry-javascript/releases/tag/7.104.0) or higher. + + +This option determines whether interactions spans automaticallly get created when an [Interaction to Next Paint (INP)](/product/performance/web-vitals/web-vitals-concepts/#interaction-to-next-paint-inp) event is detected. Interactions are scored and surfaced in the [Web Vitals](/product/performance/web-vitals/) module. + +The default is `false`. + + diff --git a/docs/product/performance/web-vitals/index.mdx b/docs/product/performance/web-vitals/index.mdx index 638ca179b79e1..2374c4a73e624 100644 --- a/docs/product/performance/web-vitals/index.mdx +++ b/docs/product/performance/web-vitals/index.mdx @@ -5,7 +5,7 @@ description: "Understand your application's performance score and how each web v --- -On March 12, 2024, Google replaced [First Input Display (FID)](/product/performance/web-vitals/web-vitals-concepts/#first-input-delay-fid) with [Interaction to Next Paint (INP)](/product/performance/web-vitals/web-vitals-concepts/#interaction-to-next-paint-inp) as a Core Web Vital. 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` is on. FID measurements are no longer shown in the **Web Vitals** page, but can still be accessed in [Discover](/product/discover-queries). You may see changes to your performance score during this transition. +On March 12, 2024, Google replaced [First Input Display (FID)](/product/performance/web-vitals/web-vitals-concepts/#first-input-delay-fid) with [Interaction to Next Paint (INP)](/product/performance/web-vitals/web-vitals-concepts/#interaction-to-next-paint-inp) as a Core Web Vital. 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/performance/instrumentation/automatic-instrumentation/#enableinp) is on. FID measurements are no longer shown in the **Web Vitals** page, but can still be accessed in [Discover](/product/discover-queries). You may see changes to your performance score during this transition. Web vitals are a set of metrics that measure the quality of the user experience on a web page. To learn more about these metrics, see [Web Vitals Concepts](/product/performance/web-vitals/web-vitals-concepts/). diff --git a/docs/product/performance/web-vitals/web-vitals-concepts.mdx b/docs/product/performance/web-vitals/web-vitals-concepts.mdx index 22b1c507574f9..3147d9b1239ef 100644 --- a/docs/product/performance/web-vitals/web-vitals-concepts.mdx +++ b/docs/product/performance/web-vitals/web-vitals-concepts.mdx @@ -7,7 +7,7 @@ description: "Understand the health of your application with Web Vitals by monit [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/performance/) of your application. -On March 12, 2024, Google replaced [First Input Display (FID)](#first-input-delay-fid) with [Interaction to Next Paint (INP)](#interaction-to-next-paint-inp) as a Core Web Vital. 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` is on. FID measurements are no longer shown in the **Web Vitals** page, but can still be accessed in [Discover](/product/discover-queries). +On March 12, 2024, Google replaced [First Input Display (FID)](#first-input-delay-fid) with [Interaction to Next Paint (INP)](#interaction-to-next-paint-inp) as a Core Web Vital. 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/performance/instrumentation/automatic-instrumentation/#enableinp) is on. FID measurements are no longer shown in the **Web Vitals** page, but can still be accessed in [Discover](/product/discover-queries). The in-browser Sentry SDKs collect web vitals information (where supported) and adds that information to frontend [transactions](/product/performance/transaction-summary/). These web vitals are then summarized in the [**Performance > Web Vitals** page](/product/performance/web-vitals/) to give you a quick overview of how each page is performing for your users. @@ -25,7 +25,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 Display (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` is on. +On March 12, 2024, Interaction to Next Paint (INP) replaced First Input Display (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/performance/instrumentation/automatic-instrumentation/#enableinp) is on. [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/platform-includes/performance/enable-inp-example/javascript.mdx b/platform-includes/performance/enable-inp-example/javascript.mdx new file mode 100644 index 0000000000000..9182861cab98e --- /dev/null +++ b/platform-includes/performance/enable-inp-example/javascript.mdx @@ -0,0 +1,10 @@ +```javascript +Sentry.init({ + // ... + integrations: [ + Sentry.browserTracingIntegration({ + enableInp: true, + }), + ], +}); +```