From 151ea786f5a7d9cfe25779e7f769e9f66e5bd392 Mon Sep 17 00:00:00 2001 From: Abdelrahman Awad Date: Thu, 11 Dec 2025 19:15:33 +0200 Subject: [PATCH 01/23] docs(nextjs): added tree-shaking webpack config guide --- .../common/configuration/tree-shaking.mdx | 35 +------ .../nextjs/configuration/build/index.mdx | 6 ++ .../nextjs/configuration/tree-shaking.mdx | 94 +++++++++++++++++++ 3 files changed, 103 insertions(+), 32 deletions(-) create mode 100644 docs/platforms/javascript/guides/nextjs/configuration/tree-shaking.mdx diff --git a/docs/platforms/javascript/common/configuration/tree-shaking.mdx b/docs/platforms/javascript/common/configuration/tree-shaking.mdx index aae211e95447f..0f207a2a8bc34 100644 --- a/docs/platforms/javascript/common/configuration/tree-shaking.mdx +++ b/docs/platforms/javascript/common/configuration/tree-shaking.mdx @@ -75,35 +75,6 @@ For more details, see the documentation for the specific bundler plugin you're u - - -### Tree Shaking With Next.js - -To tree shake Sentry debug code in Next.js projects, use webpack's [DefinePlugin](https://webpack.js.org/plugins/define-plugin/) in your Next.js configuration like in the example below: - -```javascript {filename:next.config.(js|mjs)} -const nextConfig = { - webpack: (config, { webpack }) => { - config.plugins.push( - new webpack.DefinePlugin({ - __SENTRY_DEBUG__: false, - __SENTRY_TRACING__: false, - __RRWEB_EXCLUDE_IFRAME__: true, - __RRWEB_EXCLUDE_SHADOW_DOM__: true, - __SENTRY_EXCLUDE_REPLAY_WORKER__: true, - }) - ); - - // return the modified config - return config; - }, -}; -``` - -For more information on custom webpack configurations in Next.js, see [Custom Webpack Config](https://nextjs.org/docs/api-reference/next.config.js/custom-webpack-config) in the Next.js docs. - - - ### Manual Tree Shaking If you want to tree shake optional code, remove the code from your build output by replacing various flags in the Sentry SDK. Note that if you already configured tree shaking via the Sentry Bundler Plugins, you do not need to do this manually - the plugins will take care of it for you. @@ -120,9 +91,9 @@ Replacing this flag with `false` will tree shake any SDK code that's related to `__SENTRY_TRACING__` must not be replaced with `false` when you're using any - tracing-related SDK features (for example,`Sentry.startSpan()`). This - flag is intended to be used in combination with packages like `@sentry/next` - or `@sentry/sveltekit`, which automatically include the tracing functionality. + tracing-related SDK features (for example,`Sentry.startSpan()`). This flag is + intended to be used in combination with packages like `@sentry/next` or + `@sentry/sveltekit`, which automatically include the tracing functionality. diff --git a/docs/platforms/javascript/guides/nextjs/configuration/build/index.mdx b/docs/platforms/javascript/guides/nextjs/configuration/build/index.mdx index aad7e00f1e30b..09c9944489632 100644 --- a/docs/platforms/javascript/guides/nextjs/configuration/build/index.mdx +++ b/docs/platforms/javascript/guides/nextjs/configuration/build/index.mdx @@ -314,3 +314,9 @@ Enables React component name tracking. When enabled, it annotates React componen A list of React component names to exclude from component annotation. + + + +Configuration options for tree shaking. Refer to the [tree shaking documentation](/platforms/javascript/guides/nextjs/configuration/tree-shaking) for more details. + + diff --git a/docs/platforms/javascript/guides/nextjs/configuration/tree-shaking.mdx b/docs/platforms/javascript/guides/nextjs/configuration/tree-shaking.mdx new file mode 100644 index 0000000000000..0efb9cd5e435e --- /dev/null +++ b/docs/platforms/javascript/guides/nextjs/configuration/tree-shaking.mdx @@ -0,0 +1,94 @@ +--- +title: Tree Shaking +sidebar_order: 70 +description: "Learn how to reduce Sentry bundle size by tree shaking unused code." +keywords: ["bundle size", "webpack", "Next.js", "debug"] +--- + +The Sentry Next.js SDK supports [tree shaking](https://developer.mozilla.org/en-US/docs/Glossary/Tree_shaking) for Webpack builds with some additional configurations. + +If you want to minimize the bundle size of the Sentry SDK, we recommend reading through this page and applying the tree shaking configurations as shown. + + + +This guide is only relevant if you're using Webpack to build your Next.js application. Tree-shaking options are not supported for Turbopack builds at the moment. + + + +## Tree Shaking Optional Code + +The Sentry SDK ships with code that is not strictly required for it to collect your errors. This includes code to debug your Sentry configuration or code to enable tracing, for example. While debug code can be very useful in development environments, it's not typically necessary to include it in your production bundles where it takes up valuable space. The JavaScript SDK includes special flags in its CommonJS and ESM distributions, which can be used to facilitate tree shaking (removal) of this kind of code during the build process. + + + Anything that you don't import and use will automatically be tree + shaken away by Webpack. This means that optional integrations like Replay, + BrowserTracing, BrowserProfiling, and any unused utility methods won't be + included in your bundle unless you import and use them yourself. The rest of + this page relates to ways to tree shake internal SDK code, which isn't + strictly required unless you use certain features. + + +## Tree Shaking Options + +To tree shake Sentry debug code in Next.js projects, use `webpack.treeshake` options in your Next.js Sentry build configuration like in the example below: + +```javascript {filename:next.config.(js|mjs)} +const nextConfig = { + // your next.js config +}; + +withSentryConfig(nextConfig, { + webpack: { + treeshake: { + // Tree shaking options... + removeDebugLogging: false, + removeTracing: false, + excludeReplayIframe: false, + excludeReplayShadowDOM: false, + excludeReplayCompressionWorker: false, + }, + }, +}); +``` + +For more information on custom webpack configurations in Next.js, see [Custom Webpack Config](https://nextjs.org/docs/api-reference/next.config.js/custom-webpack-config) in the Next.js docs. + +The following sections will cover each available tree shaking option and how to configure them. + + + +Setting this option to `true` will remove all debug logging code from the Sentry SDK. Note that it has nothing to do with `enableLogs` or Sentry's logs product. + +These logs can be useful to help debug your Sentry configuration or issues with the Sentry SDK. + + + + + +Setting this option to `true` will remove all code related to tracing and performance monitoring. + +Note that you should not use any tracing-related SDK features (for example, `Sentry.startSpan()`) when this option is enabled, also this option has no effect if you did not add `browserTracingIntegration`. + + + + + +Setting this option to `true` will tree shake any SDK code related to capturing iframe content with [Session Replay](/platforms/javascript/session-replay/). It's only relevant when using Session Replay. Enable this option if you don't want to record any iframes. This has no effect if you did not add `replayIntegration`. + + + + + +Setting this option to `true` will tree shake any SDK code related to capturing shadow dom elements with [Session Replay](/platforms/javascript/session-replay/). It's only relevant when using Session Replay. Enable this flag if you don't want to record any shadow dom elements. This has no effect if you didn't add `replayIntegration`. + + + + + +Setting this option to `true` will tree shake any SDK code that's related to the included compression web worker for [Session Replay](/platforms/javascript/session-replay/). It's only relevant when using Session Replay. Enable this flag if you want to host a compression worker yourself. See Using a [Custom Compression Worker](/platforms/javascript/session-replay/configuration/#using-a-custom-compression-worker) for details. This has no effect if you did not add `replayIntegration`. + +**We don't recommend enabling this flag unless you provide a custom worker URL**. + + + +If you want to learn more about the available tree shaking flags and how to set them manually with different bundlers, see the [tree shaking documentation](/platforms/javascript/common/configuration/tree-shaking/#tree-shaking-with-webpack) for the JavaScript SDK. From aa147b7c50b3e44aee685bf3256efeeafb632fd9 Mon Sep 17 00:00:00 2001 From: Abdelrahman Awad Date: Tue, 16 Dec 2025 21:22:24 +0100 Subject: [PATCH 02/23] docs: webpack casing Co-authored-by: Charly Gomez --- .../javascript/guides/nextjs/configuration/tree-shaking.mdx | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/docs/platforms/javascript/guides/nextjs/configuration/tree-shaking.mdx b/docs/platforms/javascript/guides/nextjs/configuration/tree-shaking.mdx index 0efb9cd5e435e..cd0e0d6e3c02a 100644 --- a/docs/platforms/javascript/guides/nextjs/configuration/tree-shaking.mdx +++ b/docs/platforms/javascript/guides/nextjs/configuration/tree-shaking.mdx @@ -21,7 +21,7 @@ The Sentry SDK ships with code that is not strictly required for it to collect y Anything that you don't import and use will automatically be tree - shaken away by Webpack. This means that optional integrations like Replay, + shaken away by webpack. This means that optional integrations like Replay, BrowserTracing, BrowserProfiling, and any unused utility methods won't be included in your bundle unless you import and use them yourself. The rest of this page relates to ways to tree shake internal SDK code, which isn't From a6579ce371a01f63ab7a042d8d1ecd59d0d744d1 Mon Sep 17 00:00:00 2001 From: Abdelrahman Awad Date: Tue, 16 Dec 2025 21:22:35 +0100 Subject: [PATCH 03/23] docs: webpack casing Co-authored-by: Charly Gomez --- .../javascript/guides/nextjs/configuration/tree-shaking.mdx | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/docs/platforms/javascript/guides/nextjs/configuration/tree-shaking.mdx b/docs/platforms/javascript/guides/nextjs/configuration/tree-shaking.mdx index cd0e0d6e3c02a..351a1a0f9c66d 100644 --- a/docs/platforms/javascript/guides/nextjs/configuration/tree-shaking.mdx +++ b/docs/platforms/javascript/guides/nextjs/configuration/tree-shaking.mdx @@ -11,7 +11,7 @@ If you want to minimize the bundle size of the Sentry SDK, we recommend reading -This guide is only relevant if you're using Webpack to build your Next.js application. Tree-shaking options are not supported for Turbopack builds at the moment. +This guide is only relevant if you're using webpack to build your Next.js application. Tree-shaking options are not supported for Turbopack builds at the moment. From f67322e666ed0fded28d558b269d5227bf056664 Mon Sep 17 00:00:00 2001 From: Abdelrahman Awad Date: Tue, 16 Dec 2025 21:22:43 +0100 Subject: [PATCH 04/23] docs: webpack casing Co-authored-by: Charly Gomez --- .../javascript/guides/nextjs/configuration/tree-shaking.mdx | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/docs/platforms/javascript/guides/nextjs/configuration/tree-shaking.mdx b/docs/platforms/javascript/guides/nextjs/configuration/tree-shaking.mdx index 351a1a0f9c66d..5306eb42b774d 100644 --- a/docs/platforms/javascript/guides/nextjs/configuration/tree-shaking.mdx +++ b/docs/platforms/javascript/guides/nextjs/configuration/tree-shaking.mdx @@ -5,7 +5,7 @@ description: "Learn how to reduce Sentry bundle size by tree shaking unused code keywords: ["bundle size", "webpack", "Next.js", "debug"] --- -The Sentry Next.js SDK supports [tree shaking](https://developer.mozilla.org/en-US/docs/Glossary/Tree_shaking) for Webpack builds with some additional configurations. +The Sentry Next.js SDK supports [tree shaking](https://developer.mozilla.org/en-US/docs/Glossary/Tree_shaking) for webpack builds with some additional configurations. If you want to minimize the bundle size of the Sentry SDK, we recommend reading through this page and applying the tree shaking configurations as shown. From 3ffba4bcd4861feafbce23f1d047f2c746d47667 Mon Sep 17 00:00:00 2001 From: Abdelrahman Awad Date: Tue, 16 Dec 2025 23:14:04 +0200 Subject: [PATCH 05/23] fix: 404 --- .../javascript/guides/nextjs/configuration/tree-shaking.mdx | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/docs/platforms/javascript/guides/nextjs/configuration/tree-shaking.mdx b/docs/platforms/javascript/guides/nextjs/configuration/tree-shaking.mdx index 5306eb42b774d..59492e8390f00 100644 --- a/docs/platforms/javascript/guides/nextjs/configuration/tree-shaking.mdx +++ b/docs/platforms/javascript/guides/nextjs/configuration/tree-shaking.mdx @@ -91,4 +91,4 @@ Setting this option to `true` will tree shake any SDK code that's related to the -If you want to learn more about the available tree shaking flags and how to set them manually with different bundlers, see the [tree shaking documentation](/platforms/javascript/common/configuration/tree-shaking/#tree-shaking-with-webpack) for the JavaScript SDK. +If you want to learn more about the available tree shaking flags and how to set them manually with different bundlers, see the [tree shaking documentation](/platforms/javascript/guides/react/configuration/tree-shaking/#tree-shaking-with-webpack) for the JavaScript SDK. From 5adda9902530e81575e2eb12ddd37010e6cf79a5 Mon Sep 17 00:00:00 2001 From: Abdelrahman Awad Date: Wed, 17 Dec 2025 14:19:38 +0200 Subject: [PATCH 06/23] docs: wording Co-authored-by: Sarah Mischinger --- .../javascript/guides/nextjs/configuration/tree-shaking.mdx | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/docs/platforms/javascript/guides/nextjs/configuration/tree-shaking.mdx b/docs/platforms/javascript/guides/nextjs/configuration/tree-shaking.mdx index 59492e8390f00..f09484b8f6dc2 100644 --- a/docs/platforms/javascript/guides/nextjs/configuration/tree-shaking.mdx +++ b/docs/platforms/javascript/guides/nextjs/configuration/tree-shaking.mdx @@ -73,7 +73,7 @@ Note that you should not use any tracing-related SDK features (for example, `Sen -Setting this option to `true` will tree shake any SDK code related to capturing iframe content with [Session Replay](/platforms/javascript/session-replay/). It's only relevant when using Session Replay. Enable this option if you don't want to record any iframes. This has no effect if you did not add `replayIntegration`. +Setting this option to `true` will remove any SDK code related to capturing iframe content during [Session Replays](/platforms/javascript/session-replay/). This only applies when you've enabled `replayIntegration`. From 0094352350b89487d96b0ad98bf7659b24bb2bfc Mon Sep 17 00:00:00 2001 From: Abdelrahman Awad Date: Wed, 17 Dec 2025 14:20:03 +0200 Subject: [PATCH 07/23] docs: wording Co-authored-by: Sarah Mischinger --- .../javascript/guides/nextjs/configuration/tree-shaking.mdx | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/docs/platforms/javascript/guides/nextjs/configuration/tree-shaking.mdx b/docs/platforms/javascript/guides/nextjs/configuration/tree-shaking.mdx index f09484b8f6dc2..91cd593814d56 100644 --- a/docs/platforms/javascript/guides/nextjs/configuration/tree-shaking.mdx +++ b/docs/platforms/javascript/guides/nextjs/configuration/tree-shaking.mdx @@ -79,7 +79,7 @@ Setting this option to `true` will remove any SDK code related to capturing ifra -Setting this option to `true` will tree shake any SDK code related to capturing shadow dom elements with [Session Replay](/platforms/javascript/session-replay/). It's only relevant when using Session Replay. Enable this flag if you don't want to record any shadow dom elements. This has no effect if you didn't add `replayIntegration`. +Setting this option to `true` will remove any SDK code related to capturing shadow DOM elements during [Session Replays](/platforms/javascript/session-replay/). This only applies when you've enabled `replayIntegration`. From c58bc9a82ea604a49b5a7205d5b2b319ef15d69f Mon Sep 17 00:00:00 2001 From: Abdelrahman Awad Date: Wed, 17 Dec 2025 14:20:15 +0200 Subject: [PATCH 08/23] docs: wording Co-authored-by: Sarah Mischinger --- .../javascript/guides/nextjs/configuration/tree-shaking.mdx | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/docs/platforms/javascript/guides/nextjs/configuration/tree-shaking.mdx b/docs/platforms/javascript/guides/nextjs/configuration/tree-shaking.mdx index 91cd593814d56..88ed1337c4c28 100644 --- a/docs/platforms/javascript/guides/nextjs/configuration/tree-shaking.mdx +++ b/docs/platforms/javascript/guides/nextjs/configuration/tree-shaking.mdx @@ -85,7 +85,7 @@ Setting this option to `true` will remove any SDK code related to capturing shad -Setting this option to `true` will tree shake any SDK code that's related to the included compression web worker for [Session Replay](/platforms/javascript/session-replay/). It's only relevant when using Session Replay. Enable this flag if you want to host a compression worker yourself. See Using a [Custom Compression Worker](/platforms/javascript/session-replay/configuration/#using-a-custom-compression-worker) for details. This has no effect if you did not add `replayIntegration`. +Setting this option to `true` will remove any SDK code related to the included compression web worker for [Session Replay](/platforms/javascript/session-replay/). Enable this option if you want to host a compression worker yourself. See [Using a Custom Compression Worker](/platforms/javascript/session-replay/configuration/#using-a-custom-compression-worker) for details. This only applies when you've enabled `replayIntegration`. **We don't recommend enabling this flag unless you provide a custom worker URL**. From 1987f37794257a55f7f7187f9ffb549de1a6718d Mon Sep 17 00:00:00 2001 From: Abdelrahman Awad Date: Wed, 17 Dec 2025 14:20:28 +0200 Subject: [PATCH 09/23] docs: wording Co-authored-by: Sarah Mischinger --- .../javascript/guides/nextjs/configuration/tree-shaking.mdx | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/docs/platforms/javascript/guides/nextjs/configuration/tree-shaking.mdx b/docs/platforms/javascript/guides/nextjs/configuration/tree-shaking.mdx index 88ed1337c4c28..cf3e15be707ad 100644 --- a/docs/platforms/javascript/guides/nextjs/configuration/tree-shaking.mdx +++ b/docs/platforms/javascript/guides/nextjs/configuration/tree-shaking.mdx @@ -87,7 +87,7 @@ Setting this option to `true` will remove any SDK code related to capturing shad Setting this option to `true` will remove any SDK code related to the included compression web worker for [Session Replay](/platforms/javascript/session-replay/). Enable this option if you want to host a compression worker yourself. See [Using a Custom Compression Worker](/platforms/javascript/session-replay/configuration/#using-a-custom-compression-worker) for details. This only applies when you've enabled `replayIntegration`. -**We don't recommend enabling this flag unless you provide a custom worker URL**. +**We don't recommend enabling this option unless you provide a custom worker URL**. From aae7dd55f2821e92610e6af37eeccba9ad1861a5 Mon Sep 17 00:00:00 2001 From: Abdelrahman Awad Date: Wed, 17 Dec 2025 14:20:50 +0200 Subject: [PATCH 10/23] docs: title case Co-authored-by: Sarah Mischinger --- .../javascript/guides/nextjs/configuration/tree-shaking.mdx | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/docs/platforms/javascript/guides/nextjs/configuration/tree-shaking.mdx b/docs/platforms/javascript/guides/nextjs/configuration/tree-shaking.mdx index cf3e15be707ad..fe1924f5b8eb6 100644 --- a/docs/platforms/javascript/guides/nextjs/configuration/tree-shaking.mdx +++ b/docs/platforms/javascript/guides/nextjs/configuration/tree-shaking.mdx @@ -28,7 +28,7 @@ The Sentry SDK ships with code that is not strictly required for it to collect y strictly required unless you use certain features. -## Tree Shaking Options +## Tree-Shaking Options To tree shake Sentry debug code in Next.js projects, use `webpack.treeshake` options in your Next.js Sentry build configuration like in the example below: From acf75838e19b2517ff7cd3dfe2a693eb93ec2b57 Mon Sep 17 00:00:00 2001 From: Abdelrahman Awad Date: Wed, 17 Dec 2025 14:21:07 +0200 Subject: [PATCH 11/23] chore: title case Co-authored-by: Sarah Mischinger --- .../javascript/guides/nextjs/configuration/tree-shaking.mdx | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/docs/platforms/javascript/guides/nextjs/configuration/tree-shaking.mdx b/docs/platforms/javascript/guides/nextjs/configuration/tree-shaking.mdx index fe1924f5b8eb6..0ed4979514ac6 100644 --- a/docs/platforms/javascript/guides/nextjs/configuration/tree-shaking.mdx +++ b/docs/platforms/javascript/guides/nextjs/configuration/tree-shaking.mdx @@ -15,7 +15,7 @@ This guide is only relevant if you're using webpack to build your Next.js applic -## Tree Shaking Optional Code +## Tree-Shaking Optional Code The Sentry SDK ships with code that is not strictly required for it to collect your errors. This includes code to debug your Sentry configuration or code to enable tracing, for example. While debug code can be very useful in development environments, it's not typically necessary to include it in your production bundles where it takes up valuable space. The JavaScript SDK includes special flags in its CommonJS and ESM distributions, which can be used to facilitate tree shaking (removal) of this kind of code during the build process. From be647a9a2238ba1a8d613b3dd6d338965e9bda45 Mon Sep 17 00:00:00 2001 From: Abdelrahman Awad Date: Wed, 17 Dec 2025 14:21:27 +0200 Subject: [PATCH 12/23] docs: improve wording Co-authored-by: Sarah Mischinger --- .../javascript/guides/nextjs/configuration/tree-shaking.mdx | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/docs/platforms/javascript/guides/nextjs/configuration/tree-shaking.mdx b/docs/platforms/javascript/guides/nextjs/configuration/tree-shaking.mdx index 0ed4979514ac6..44b87fa9ac200 100644 --- a/docs/platforms/javascript/guides/nextjs/configuration/tree-shaking.mdx +++ b/docs/platforms/javascript/guides/nextjs/configuration/tree-shaking.mdx @@ -59,7 +59,7 @@ The following sections will cover each available tree shaking option and how to Setting this option to `true` will remove all debug logging code from the Sentry SDK. Note that it has nothing to do with `enableLogs` or Sentry's logs product. -These logs can be useful to help debug your Sentry configuration or issues with the Sentry SDK. +These logs can help debug your Sentry configuration or issues with the Sentry SDK. From bcdeaefa9b4a4308677b233f35297510aaa2d01d Mon Sep 17 00:00:00 2001 From: Abdelrahman Awad Date: Wed, 17 Dec 2025 14:22:07 +0200 Subject: [PATCH 13/23] docs: wording consistency around the word tree-shake Co-authored-by: Sarah Mischinger --- .../javascript/guides/nextjs/configuration/tree-shaking.mdx | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/docs/platforms/javascript/guides/nextjs/configuration/tree-shaking.mdx b/docs/platforms/javascript/guides/nextjs/configuration/tree-shaking.mdx index 44b87fa9ac200..d42a3bcbf87c0 100644 --- a/docs/platforms/javascript/guides/nextjs/configuration/tree-shaking.mdx +++ b/docs/platforms/javascript/guides/nextjs/configuration/tree-shaking.mdx @@ -7,7 +7,7 @@ keywords: ["bundle size", "webpack", "Next.js", "debug"] The Sentry Next.js SDK supports [tree shaking](https://developer.mozilla.org/en-US/docs/Glossary/Tree_shaking) for webpack builds with some additional configurations. -If you want to minimize the bundle size of the Sentry SDK, we recommend reading through this page and applying the tree shaking configurations as shown. +If you want to minimize the bundle size of the Sentry SDK, we recommend reading through this page and applying the tree-shaking configurations shown. From 469e87bd7402a1a8b6dfbab06a74caff9e80c55f Mon Sep 17 00:00:00 2001 From: Abdelrahman Awad Date: Wed, 17 Dec 2025 14:25:33 +0200 Subject: [PATCH 14/23] fix: alert wording --- .../nextjs/configuration/tree-shaking.mdx | 18 +++++++++++------- 1 file changed, 11 insertions(+), 7 deletions(-) diff --git a/docs/platforms/javascript/guides/nextjs/configuration/tree-shaking.mdx b/docs/platforms/javascript/guides/nextjs/configuration/tree-shaking.mdx index d42a3bcbf87c0..935a78334cd0f 100644 --- a/docs/platforms/javascript/guides/nextjs/configuration/tree-shaking.mdx +++ b/docs/platforms/javascript/guides/nextjs/configuration/tree-shaking.mdx @@ -20,12 +20,12 @@ This guide is only relevant if you're using webpack to build your Next.js applic The Sentry SDK ships with code that is not strictly required for it to collect your errors. This includes code to debug your Sentry configuration or code to enable tracing, for example. While debug code can be very useful in development environments, it's not typically necessary to include it in your production bundles where it takes up valuable space. The JavaScript SDK includes special flags in its CommonJS and ESM distributions, which can be used to facilitate tree shaking (removal) of this kind of code during the build process. - Anything that you don't import and use will automatically be tree - shaken away by webpack. This means that optional integrations like Replay, - BrowserTracing, BrowserProfiling, and any unused utility methods won't be - included in your bundle unless you import and use them yourself. The rest of - this page relates to ways to tree shake internal SDK code, which isn't - strictly required unless you use certain features. + Anything you don't import or use can be tree shaken by webpack. This means + that optional integrations like Session Replay, Browser Tracing, Browser + Profiling, and any unused utility methods won't be included in your bundle + unless you import and use them. The rest of this page covers ways to tree + shake internal SDK code, which you only need if you're using certain Sentry + features. ## Tree-Shaking Options @@ -67,7 +67,11 @@ These logs can help debug your Sentry configuration or issues with the Sentry SD Setting this option to `true` will remove all code related to tracing and performance monitoring. -Note that you should not use any tracing-related SDK features (for example, `Sentry.startSpan()`) when this option is enabled, also this option has no effect if you did not add `browserTracingIntegration`. + + Note that you should not use any tracing-related SDK features (for example, + `Sentry.startSpan()`) when this option is enabled, also this option has no + effect if you did not add `browserTracingIntegration`. + From 1437ad69e2c8a2d11ecbfb51bd8074f1a116ed13 Mon Sep 17 00:00:00 2001 From: Abdelrahman Awad Date: Wed, 17 Dec 2025 14:27:37 +0200 Subject: [PATCH 15/23] docs: re-word to be next.js specific --- .../javascript/guides/nextjs/configuration/tree-shaking.mdx | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/docs/platforms/javascript/guides/nextjs/configuration/tree-shaking.mdx b/docs/platforms/javascript/guides/nextjs/configuration/tree-shaking.mdx index 935a78334cd0f..c01e121d2aff4 100644 --- a/docs/platforms/javascript/guides/nextjs/configuration/tree-shaking.mdx +++ b/docs/platforms/javascript/guides/nextjs/configuration/tree-shaking.mdx @@ -17,7 +17,7 @@ This guide is only relevant if you're using webpack to build your Next.js applic ## Tree-Shaking Optional Code -The Sentry SDK ships with code that is not strictly required for it to collect your errors. This includes code to debug your Sentry configuration or code to enable tracing, for example. While debug code can be very useful in development environments, it's not typically necessary to include it in your production bundles where it takes up valuable space. The JavaScript SDK includes special flags in its CommonJS and ESM distributions, which can be used to facilitate tree shaking (removal) of this kind of code during the build process. +The Sentry Next.js SDK includes code that isn't strictly required for basic error collection, such as debug logging and tracing functionality. While debug code is useful during development, it adds unnecessary weight to your production bundles. The Next.js SDK provides tree shaking options through the `withSentryConfig` function, allowing you to remove this optional code during the webpack build process. Anything you don't import or use can be tree shaken by webpack. This means From ef40d1deb08f2d24ef15d17f418e48d7c22a01f8 Mon Sep 17 00:00:00 2001 From: Abdelrahman Awad Date: Wed, 17 Dec 2025 14:29:04 +0200 Subject: [PATCH 16/23] docs: wording Co-authored-by: Sarah Mischinger --- .../javascript/guides/nextjs/configuration/tree-shaking.mdx | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/docs/platforms/javascript/guides/nextjs/configuration/tree-shaking.mdx b/docs/platforms/javascript/guides/nextjs/configuration/tree-shaking.mdx index c01e121d2aff4..ca33260fd5962 100644 --- a/docs/platforms/javascript/guides/nextjs/configuration/tree-shaking.mdx +++ b/docs/platforms/javascript/guides/nextjs/configuration/tree-shaking.mdx @@ -30,7 +30,7 @@ The Sentry Next.js SDK includes code that isn't strictly required for basic erro ## Tree-Shaking Options -To tree shake Sentry debug code in Next.js projects, use `webpack.treeshake` options in your Next.js Sentry build configuration like in the example below: +To tree shake Sentry debug code in Next.js projects, use `webpack.treeshake` options in your build configuration, like in this example: ```javascript {filename:next.config.(js|mjs)} const nextConfig = { From caa4d45f8fcf78d2e4d5ed4e1a07dd65424a9f39 Mon Sep 17 00:00:00 2001 From: Abdelrahman Awad Date: Wed, 17 Dec 2025 14:29:21 +0200 Subject: [PATCH 17/23] chore: wording Co-authored-by: Sarah Mischinger --- .../javascript/guides/nextjs/configuration/tree-shaking.mdx | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/docs/platforms/javascript/guides/nextjs/configuration/tree-shaking.mdx b/docs/platforms/javascript/guides/nextjs/configuration/tree-shaking.mdx index ca33260fd5962..21acd6ccbc80a 100644 --- a/docs/platforms/javascript/guides/nextjs/configuration/tree-shaking.mdx +++ b/docs/platforms/javascript/guides/nextjs/configuration/tree-shaking.mdx @@ -95,4 +95,4 @@ Setting this option to `true` will remove any SDK code related to the included c -If you want to learn more about the available tree shaking flags and how to set them manually with different bundlers, see the [tree shaking documentation](/platforms/javascript/guides/react/configuration/tree-shaking/#tree-shaking-with-webpack) for the JavaScript SDK. +If you want to learn more about the available tree-shaking options and how to set them manually with different bundlers, see the [tree shaking documentation](/platforms/javascript/guides/react/configuration/tree-shaking/#tree-shaking-with-webpack) for the JavaScript SDK. From 13e76ff45bf8c6236acfd62f4454e9050d68bd51 Mon Sep 17 00:00:00 2001 From: Abdelrahman Awad Date: Wed, 17 Dec 2025 14:29:57 +0200 Subject: [PATCH 18/23] chore: wording Co-authored-by: Sarah Mischinger --- .../javascript/guides/nextjs/configuration/tree-shaking.mdx | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/docs/platforms/javascript/guides/nextjs/configuration/tree-shaking.mdx b/docs/platforms/javascript/guides/nextjs/configuration/tree-shaking.mdx index 21acd6ccbc80a..184b55b64b2ac 100644 --- a/docs/platforms/javascript/guides/nextjs/configuration/tree-shaking.mdx +++ b/docs/platforms/javascript/guides/nextjs/configuration/tree-shaking.mdx @@ -53,7 +53,7 @@ withSentryConfig(nextConfig, { For more information on custom webpack configurations in Next.js, see [Custom Webpack Config](https://nextjs.org/docs/api-reference/next.config.js/custom-webpack-config) in the Next.js docs. -The following sections will cover each available tree shaking option and how to configure them. +The following sections cover each available tree-shaking option and how to configure them. From 4895f433113da47198ddd1d4b44f1a984723d609 Mon Sep 17 00:00:00 2001 From: Abdelrahman Awad Date: Wed, 17 Dec 2025 14:31:39 +0200 Subject: [PATCH 19/23] docs: alert wording --- .../javascript/guides/nextjs/configuration/tree-shaking.mdx | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/docs/platforms/javascript/guides/nextjs/configuration/tree-shaking.mdx b/docs/platforms/javascript/guides/nextjs/configuration/tree-shaking.mdx index 184b55b64b2ac..9d47a603abdfe 100644 --- a/docs/platforms/javascript/guides/nextjs/configuration/tree-shaking.mdx +++ b/docs/platforms/javascript/guides/nextjs/configuration/tree-shaking.mdx @@ -68,7 +68,7 @@ These logs can help debug your Sentry configuration or issues with the Sentry SD Setting this option to `true` will remove all code related to tracing and performance monitoring. - Note that you should not use any tracing-related SDK features (for example, + You should not use any tracing-related SDK features (for example, `Sentry.startSpan()`) when this option is enabled, also this option has no effect if you did not add `browserTracingIntegration`. From f2f1547c0eedb3e78bc09e8180e2c1233d5ccf3d Mon Sep 17 00:00:00 2001 From: Abdelrahman Awad Date: Wed, 17 Dec 2025 15:37:26 +0200 Subject: [PATCH 20/23] docs: debug logging info --- .../javascript/guides/nextjs/configuration/tree-shaking.mdx | 4 +--- 1 file changed, 1 insertion(+), 3 deletions(-) diff --git a/docs/platforms/javascript/guides/nextjs/configuration/tree-shaking.mdx b/docs/platforms/javascript/guides/nextjs/configuration/tree-shaking.mdx index 9d47a603abdfe..018e91bb07e51 100644 --- a/docs/platforms/javascript/guides/nextjs/configuration/tree-shaking.mdx +++ b/docs/platforms/javascript/guides/nextjs/configuration/tree-shaking.mdx @@ -57,9 +57,7 @@ The following sections cover each available tree-shaking option and how to confi -Setting this option to `true` will remove all debug logging code from the Sentry SDK. Note that it has nothing to do with `enableLogs` or Sentry's logs product. - -These logs can help debug your Sentry configuration or issues with the Sentry SDK. +Setting this option to true will remove all Sentry SDK debug logging code (the console logs that appear when you set debug: true in your SDK configuration). This doesn't affect Sentry's Logs product (controlled by the enableLogs option) or your app's logging. From 0ec7cee83ba9b434a2dcf503aad8094624b4a060 Mon Sep 17 00:00:00 2001 From: Abdelrahman Awad Date: Wed, 17 Dec 2025 14:57:55 +0100 Subject: [PATCH 21/23] chore: docs Co-authored-by: Sarah Mischinger --- .../javascript/guides/nextjs/configuration/tree-shaking.mdx | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/docs/platforms/javascript/guides/nextjs/configuration/tree-shaking.mdx b/docs/platforms/javascript/guides/nextjs/configuration/tree-shaking.mdx index 018e91bb07e51..d72ef907eb0ba 100644 --- a/docs/platforms/javascript/guides/nextjs/configuration/tree-shaking.mdx +++ b/docs/platforms/javascript/guides/nextjs/configuration/tree-shaking.mdx @@ -57,7 +57,7 @@ The following sections cover each available tree-shaking option and how to confi -Setting this option to true will remove all Sentry SDK debug logging code (the console logs that appear when you set debug: true in your SDK configuration). This doesn't affect Sentry's Logs product (controlled by the enableLogs option) or your app's logging. +Setting this option to true will remove all Sentry SDK debug logging code (the console logs that appear when you set `debug: true` in your SDK configuration). This doesn't affect Sentry's Logs product (controlled by the `enableLogs` option) or your app's logging. From 730c3e4de90c93d537e222d33b90bec1d6e61b4e Mon Sep 17 00:00:00 2001 From: Abdelrahman Awad Date: Thu, 18 Dec 2025 16:23:14 +0100 Subject: [PATCH 22/23] docs: space Co-authored-by: Copilot <175728472+Copilot@users.noreply.github.com> --- docs/platforms/javascript/common/configuration/tree-shaking.mdx | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/docs/platforms/javascript/common/configuration/tree-shaking.mdx b/docs/platforms/javascript/common/configuration/tree-shaking.mdx index 0f207a2a8bc34..6081d57d28bbf 100644 --- a/docs/platforms/javascript/common/configuration/tree-shaking.mdx +++ b/docs/platforms/javascript/common/configuration/tree-shaking.mdx @@ -91,7 +91,7 @@ Replacing this flag with `false` will tree shake any SDK code that's related to `__SENTRY_TRACING__` must not be replaced with `false` when you're using any - tracing-related SDK features (for example,`Sentry.startSpan()`). This flag is + tracing-related SDK features (for example, `Sentry.startSpan()`). This flag is intended to be used in combination with packages like `@sentry/next` or `@sentry/sveltekit`, which automatically include the tracing functionality. From 0365982a7e5204670a4f3acba452813c6f552343 Mon Sep 17 00:00:00 2001 From: Abdelrahman Awad Date: Thu, 18 Dec 2025 16:23:37 +0100 Subject: [PATCH 23/23] docs: grammar Co-authored-by: Copilot <175728472+Copilot@users.noreply.github.com> --- .../javascript/guides/nextjs/configuration/tree-shaking.mdx | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/docs/platforms/javascript/guides/nextjs/configuration/tree-shaking.mdx b/docs/platforms/javascript/guides/nextjs/configuration/tree-shaking.mdx index d72ef907eb0ba..0e1449901922c 100644 --- a/docs/platforms/javascript/guides/nextjs/configuration/tree-shaking.mdx +++ b/docs/platforms/javascript/guides/nextjs/configuration/tree-shaking.mdx @@ -67,7 +67,7 @@ Setting this option to `true` will remove all code related to tracing and perfor You should not use any tracing-related SDK features (for example, - `Sentry.startSpan()`) when this option is enabled, also this option has no + `Sentry.startSpan()`) when this option is enabled. Also, this option has no effect if you did not add `browserTracingIntegration`.