Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Jump to bottom

fix(browser): Fix memory leak in addEventListener instrumentation #5147

Merged
merged 6 commits into from
May 24, 2022
Merged

fix(browser): Fix memory leak in addEventListener instrumentation #5147

merged 6 commits into from
May 24, 2022

Conversation

lforst
Copy link
Member

@lforst lforst commented May 20, 2022 •
edited

We currently have a memory leak in the instrumentation of addEventListener in @sentry/browser. It happens when users provide an object as event listener to addEventListener. The handleEvent function gets wrapped and instrumented each time the listener is attached somewhere.

This PR:

  • Aims to get rid of the memory leak
  • Adds some integration tests that tests for potential issues with the instrumentation of addEventListener in the future

Fixes #2957
Ref: https://getsentry.atlassian.net/browse/WEB-916

Reproduction of the memory leak

<!DOCTYPE html>
<html lang="en">
  <head>
    <script src="https://browser.sentry-cdn.com/6.19.7/bundle.min.js"></script>
  </head>
  <body>
    <h1>Listener memory leak repro</h1>
    <p>
      Instructions:<br />
      1) Open console<br />
      2) Press "add listener" a bunch of times<br />
      3) Press "trigger listener"<br />
      4) Repeat step 2 and 3<br />
      5) Examine trace<br />
    </p>
    <button onclick="addListener()">add listener</button>
    <button id="trigger">trigger listener</button>

    <script>
      Sentry.init({
        dsn: "https://examplePublicKey@o0.ingest.sentry.io/0",
      });

      const listener = {
        handleEvent() {
          console.trace("listener called");
        },
      };

      function addListener() {
        console.log("adding listener");
        document.getElementById("trigger").addEventListener("click", listener);
      }
    </script>
  </body>
</html>

@github-actions
Copy link
Contributor

github-actions bot commented May 20, 2022 •
edited

size-limit report 📦

Path Size
@sentry/browser - ES5 CDN Bundle (gzipped + minified) 19.32 KB (-4.07% 🔽)
@sentry/browser - ES5 CDN Bundle (minified) 59.9 KB (-7.3% 🔽)
@sentry/browser - ES6 CDN Bundle (gzipped + minified) 18.18 KB (-3.63% 🔽)
@sentry/browser - ES6 CDN Bundle (minified) 53.58 KB (-7.57% 🔽)
@sentry/browser - Webpack (gzipped + minified) 19.87 KB (-14.49% 🔽)
@sentry/browser - Webpack (minified) 63.03 KB (-22.87% 🔽)
@sentry/react - Webpack (gzipped + minified) 19.89 KB (-14.53% 🔽)
@sentry/nextjs Client - Webpack (gzipped + minified) 43.7 KB (-9.06% 🔽)
@sentry/browser + @sentry/tracing - ES5 CDN Bundle (gzipped + minified) 25.33 KB (-2.87% 🔽)
@sentry/browser + @sentry/tracing - ES6 CDN Bundle (gzipped + minified) 23.88 KB (-2.46% 🔽)

@lforst lforst marked this pull request as ready for review May 23, 2022 13:44
@lforst lforst requested review from kamilogorek and Lms24 May 23, 2022 13:44
Lms24
Lms24 approved these changes May 24, 2022
View reviewed changes
Copy link
Member

@Lms24 Lms24 left a comment

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Awesome stuff!

kamilogorek
kamilogorek approved these changes May 24, 2022
View reviewed changes
Copy link
Contributor

@kamilogorek kamilogorek left a comment

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Simple fix, yet so much value-added through great tests. Thanks 🙏

@lforst lforst merged commit bbc9d3d into 7.x May 24, 2022
@lforst lforst deleted the lforst/event-fixes branch May 24, 2022 11:28
@lforst lforst mentioned this pull request May 24, 2022
Closed
9 tasks
AbhiPrasad pushed a commit that referenced this pull request May 30, 2022
@lforst @AbhiPrasad
fix(browser): Fix memory leak in addEventListener instrumentation (#…
9b74870 
…5147)
@AbhiPrasad AbhiPrasad added this to the 7.0.0 milestone May 30, 2022
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Reviewers

@kamilogorek kamilogorek kamilogorek approved these changes

@Lms24 Lms24 Lms24 approved these changes

Assignees
No one assigned
Labels
None yet
Projects
None yet
Milestone
7.0.0
Development

Successfully merging this pull request may close these issues.

None yet
4 participants
@lforst @kamilogorek @Lms24 @AbhiPrasad