4 ms·
Not entirely right, though I do love the Perf tab. (Disclosure: I work on it.) This extension adds instrumentation to listen to changes to DOM nodes and style
by paulirish 9y ago
Not entirely right, though I do love the Perf tab. (Disclosure: I work on it.)
This extension adds instrumentation to listen to changes to DOM nodes and style attributes. And it reports exactly what the change was: https://github.com/pilagod/js-tracker/blob/master/src/tracker/trackers/dom/trackerHelpers.ts https://github.com/pilagod/js-tracker/blob/master/src/tracke...
That level of detail isn't really provided in the Perf tab, as it's quite invasive and can have significant perf overhead in a busy webapp. (DevTools does have a hidden experiment called "Timeline: Invalidation Tracking" which does report on various DOM/CSS changes, though. It's cool).
Also, I should point out a _very_ similar extension my mate built: https://github.com/kdzwinel/DOMListenerExtension https://github.com/kdzwinel/DOMListenerExtension Same basic idea, but just reporting every change to DOM nodes that a MutationObserver can see.
- pilagod 9y agoReally nice explanation in detail, I do really learn a lot from your reply. And I'm so glad to hear that your mate has done a great job relevant to this topic, I have search for a long time but didn't get any relative work. I will look over his repo and learn more from there. Thanks again for your in-depth reply !