Performance: segment blocks the main thread

[zallarak]

Segment seems to block the main thread for 300+ ms

We are using async tags though. Any ideas?

  // Segment
  renderSegmentSnippet() {
    const opts = {
      apiKey: env.SEGMENT_WRITE_KEY,
      page: true,
    };
    if (process.env.NODE_ENV === "development") {
      return snippet.max(opts);
    }
    return snippet.min(opts);
  }

...
          {/* Segment */}
          <script
            async
            dangerouslySetInnerHTML={{ __html: this.renderSegmentSnippet() }}
          />

[devdpontes]

We're having the same problem. I've also noticed that further XHR requests from segment also block the main thread, making the UI sluggish.

[confact]

I have the same problem. Using next.js but blocks either the main thread or not loading when trying to optimize it.

[zemariagp]

Exactly the same here. If I block segment commons JS on the network tab my INP drops 300ms.

[pbusby]

Same! Button interactions are getting flagged as poor INP in Core Web Vitals when throttling Compute to "4x slowdown" in Chrome Performance tab and the only thing that seems to help is by blocking Segment requests. Anyone find a way to load Segment more optimally to prevent this?