3 ms·
> If we’re expecting the page DOM to change often (for example, with SPAs), we certainly don’t want to miss out on any valuable data. Just set a MutationObserve
by Sephr 4y ago
> If we’re expecting the page DOM to change often (for example, with SPAs), we certainly don’t want to miss out on any valuable data. Just set a MutationObserver to watch the entire page, and reapply listeners as needed.
The code below this text is highly inefficient and may lead the user detection solely from page interactivity slowdown alone. A more efficient implementation could read input using the 'input' event[1]. For example, here[2] is how you would use the input event to detect changes to any fields in a page.
1. https://developer.mozilla.org/en-US/docs/Web/API/HTMLElement/input_event https://developer.mozilla.org/en-US/docs/Web/API/HTMLElement...
2. https://gist.github.com/eligrey/615fcc9fa9edbfb5153478109b5b1185#file-universal-unsaved-changes-detector-js-L21-L37 https://gist.github.com/eligrey/615fcc9fa9edbfb5153478109b5b...
- mfrisbie 4y agoFair point, multiple people have circled this snippet as problematic. I'll confess, I didn't spend much time testing this for performance. My idea was that separate inputs should have separate debounced handlers, but it's likely you could do away with that and just listen for input events globally with no adverse effect on data collection.