question-mark
Stuck on an issue?

Lightrun Answers was designed to reduce the constant googling that comes with debugging 3rd party libraries. It collects links to all the places you might be looking at while hunting down a tough bug.

And, if you’re still stuck at the end, we’re happy to hop on a call to see how we can help out.

Event listener leak in "Input" component

See original GitHub issue

Describe the bug It looks like the Input component leaks event listeners

To Reproduce

const TestEventListenersLeak = () => {
  const [value, setValue] = createSignal(0);
  setInterval(() => setValue(v => v+1), 100)

  return (
    <Input
      type="number"
      value={value()}
    />
  );
}

Watch for “JS event listeners” number in the performance monitor of chrome tools.

Expected behavior The event listeners and DOM nodes should not increase in the test case above

Issue Analytics

  • State:closed
  • Created a year ago
  • Comments:6

github_iconTop GitHub Comments

1reaction
jcmonnincommented, May 3, 2022

Thanks, alignItems="start" in the parent stack does the trick. I guess I need to read the styling part of the documentation more carefully. Given it looked nice by default, I didn’t really had to worry about it so far.

Read more comments on GitHub >

github_iconTop Results From Across the Web

Event listener leak · Issue #12947 · facebook/react - GitHub
This appears to indicate that there is a leak related to the actual input event processing. This suggests that it's likely not related...
Read more >
JavaScript event listener memory leak - Stack Overflow
I'm working on a WebGL application using React, Redux and Three.js. My application uses mouse movements and clicks as input. Now for some...
Read more >
Causes of Memory Leaks in JavaScript and How to Avoid Them
What Is a Memory Leak? Sources of Memory Leaks in JavaScript. Accidental Global Variables; Closures; Timers; Event Listeners; Cache; Detached DOM Elements ...
Read more >
Handling the "possible EventEmitter memory leak detected ...
The “possible EventEmitter memory leak” error can occur any time addListener runs multiple times without the corresponding removeListener ...
Read more >
How to Identify, Diagnose, and Fix Memory Leaks in Web Apps
An event listener prevents objects and variables captured in its scope from being garbage collected. Thus, if you forget to stop listening, you...
Read more >

github_iconTop Related Medium Post

No results found

github_iconTop Related StackOverflow Question

No results found

github_iconTroubleshoot Live Code

Lightrun enables developers to add logs, metrics and snapshots to live code - no restarts or redeploys required.
Start Free

github_iconTop Related Reddit Thread

No results found

github_iconTop Related Hackernoon Post

No results found

github_iconTop Related Tweet

No results found

github_iconTop Related Dev.to Post

No results found

github_iconTop Related Hashnode Post

No results found