They can occur when the JavaScript code of an application retains more and more objects in memory that it doesn’t need any longer instead of releasing them for the browser to garbage collect (GC). In the case of long-running apps, small memory leaks of only a few kilobytes can add up to noticeably degrade performance over time. Recently, the Redmond-based tech company has made a new Detached Elements tool to identify problems and help stop leaks.

Memory leak debugging has never been this easy

Microsoft explained how the Detached Elements tool works and gave a proper rundown for all those interested in this subject. Basically, this new tool will help you investigate and resolve DOM memory leaks, and is inspired by the Microsoft Teams department, according to the tech giant. Before you try this new tool on your own web content, it’s important to understand some of the nuances between detached elements and DOM leaks. Usually, Microsoft creates DOM nodes in JavaScript to insert them somewhere in the page to display them. However, it is also possible to create nodes and never attach them or remove nodes from the page and keep references to them in JavaScript. If you want, you can test out the new tool’s capabilities via a demo app on GitHub. It will let you simulate memory leaks and see where the Detachable Elements utility comes in handy. Keep in mind that Microsoft urges those interested in its new creation to test out the tool in real scenarios to discover any potential problems. And if you also want to provide some much-needed feedback, you can do so via the DevTools feedback button or, alternatively, by throwing tweets at the Edge DevTools Twitter account. Excited about this new set of tools? Share your thoughts with us in the comments section below.

Name * Email * Commenting as . Not you? Save information for future comments
Comment

Δ