Best way to only init integrations that exist? Like if you wanted to only run Replays on certain pages?

[nicholashead]

Some context - we run a website with a lot of SEO landing pages that need to stay performant - so we want to load Sentry with the smallest possible footprint (errors only bundle). On other parts of our site, however, we want the full bundle - performance tracing and replays. So I am adding logic to dynamically emit two different bundle URLs for Sentry's CDN based on the rules.

I have one centralized script though that deals with actually initializing Sentry and the integrations, for example:

Sentry.init({
                integrations: [
                    Sentry.browserTracingIntegration(),
                    Sentry.replayIntegration({ networkDetailAllowUrls: [window.location.origin] })
                ],
                dsn: 'xxxxx'
});

How can I update the "integrations" to be dynamic, so we don't include tracing/replay if it's not actually loaded? My first inclination was to check to see if Sentry.browserTracingIntegration is undefined/truthy:

const integrations = [];
            if (Sentry.browserTracingIntegration) {
                integrations.push(Sentry.browserTracingIntegration());
            }
            if (Sentry.replayIntegration) {
                integrations.push(Sentry.replayIntegration({ networkDetailAllowUrls: [window.location.origin] }));
            }

Or am I overthinking this, and leaving those in will actually be fine/not cause errors? Or do I even need the "integrations" block at all (if init like self-bootstraps/finds all loaded integrations?)

Thanks for any guidance. I tried to read the docs, but feel like this isn't that clear. If anyone has any other advice too to minimize page speed impact by Sentry, that'd be great.

[AbhiPrasad]

@nicholashead - we shim browserTracingIntegration and replayIntegration between our CDN bundles (via https://github.com/getsentry/sentry-javascript/tree/develop/packages/integration-shims) - you can just use the first snippet with Sentry.init and the integrations and it'll all work.

I guess only problem is that we log out this warning atm

sentry-javascript/packages/integration-shims/src/BrowserTracing.ts

Line 29 in 437d20a

console.warn('You are using new BrowserTracing() even though this bundle does not include tracing.');

- probably will increase noise in your console.

Curious though - what is your target bundle size? Or metric you are measuring against? How much does adding replay/performance impact that metric?

We should document this better! Will create a task for that.

[nicholashead]

Thanks! I discovered the shim on my own today playing with things. I wound up just setting a window property (boo, I know) to indicate what bundle I had loaded and do it that way.

The reason we're doing the bundles this way is we're seeing much worse Google Page Speed scores and we're trying to eliminate anything that could've contributed to it. I'm not using the Sentry loader (which I assume is more efficient/less impact on page speed checks?) - and it would be a little bit of work I think to adjust our code to use the loader. So the regular bundle it is. The replay stuff has to cause a bit of growth on the bundle size and page speed, right?