Performance Issues After Sentry Configuration Update

[NadiaSorokova]

Is there an existing issue for this?

• I have checked for existing issues https://github.com/getsentry/sentry-javascript/issues
• I have reviewed the documentation https://docs.sentry.io/
• I am using the latest SDK release https://github.com/getsentry/sentry-javascript/releases

How do you use Sentry?

Sentry Saas (sentry.io)

Which SDK are you using?

@sentry/nextjs

SDK Version

8.47.0

Framework Version

No response

Link to Sentry event

No response

Reproduction Example/SDK Setup

No response

Steps to Reproduce

Added the following configuration to Sentry, and it's being fixed now after removing includeLocalVariables: true:

sentry.client.config:

import { feedbackIntegration, init, replayIntegration, setTags } from '@sentry/nextjs';

init({
  dsn: process.env.NEXT_PUBLIC_SENTRY_DSN || '',
  integrations: [
    replayIntegration(),
    ...(process.env.NEXT_PUBLIC_SENTRY_ENVIRONMENT === 'staging'
      ? [feedbackIntegration()]
      : [])
  ],
  tracesSampleRate: parseFloat(process.env.NEXT_PUBLIC_SENTRY_SAMPLE_RATE ?? '1'),
  replaysSessionSampleRate: 0.1,
  replaysOnErrorSampleRate: 1.0,
  debug: process.env.NEXT_PUBLIC_SENTRY_DEBUG === 'true' || false,

  includeLocalVariables: true,
  environment: process.env.NEXT_PUBLIC_SENTRY_ENVIRONMENT || '',
  allowUrls: [
    /https?:\/\/([a-z]+\.)?carhartt-wip\.(local|com(\/en-[A-Z]{2})?)/,
  ],
});

setTags({
  "vercel_link": process.env.NEXT_PUBLIC_VERCEL_URL,
  "device": window.innerWidth > 768 ? "desktop" : "mobile"
})

sentry.edge.config:

import { init } from '@sentry/nextjs';

init({
  dsn: process.env.NEXT_PUBLIC_SENTRY_DSN || '',
  tracesSampleRate: parseFloat(process.env.NEXT_PUBLIC_SENTRY_SAMPLE_RATE ?? '1'),
  debug: process.env.NEXT_PUBLIC_SENTRY_DEBUG === 'true' || false,
  includeLocalVariables: true,
  environment: process.env.NEXT_PUBLIC_SENTRY_ENVIRONMENT || '',
  allowUrls: [
    /https?:\/\/([a-z]+\.)?carhartt-wip\.(local|com(\/en-[A-Z]{2})?)/,
  ],
});

sentry.server.config:

import { init } from '@sentry/nextjs';

init({
  dsn: process.env.NEXT_PUBLIC_SENTRY_DSN || '',
  tracesSampleRate: parseFloat(process.env.NEXT_PUBLIC_SENTRY_SAMPLE_RATE ?? '1'),
  debug: process.env.NEXT_PUBLIC_SENTRY_DEBUG === 'true' || false,
  environment: process.env.NEXT_PUBLIC_SENTRY_ENVIRONMENT || '',
  includeLocalVariables: true,
  allowUrls: [
    /https?:\/\/([a-z]+\.)?carhartt-wip\.(local|com(\/en-[A-Z]{2})?)/,
  ],
});

Expected Result

The website’s performance should remain normal, without visible slowdowns or delays during page rendering

Actual Result

After adding the following config, the website's performance worsened. Pages started loading slowly. After removing the line includeLocalVariables: true, the performance returned to normal.

[AbhiPrasad]

@NadiaSorokova thanks for reporting.

Do you see similar performance slowdowns when running the project locally, or only in production environments?

[NadiaSorokova]

@AbhiPrasad Hi 😊 It was slowed down both locally and in production environments

[AbhiPrasad]

Under the hood the local variables feature uses the nodejs inspector, which does have performance impact, but it shouldn't impact rendering performance like this for nextjs.

How complex is your next.js backend? Do you have an extensive react server components setup?

For now you'll have to disable this feature, but we'll take a look further to see what is going on.