Thursday, 16 May 2019

How to create memory leak and monitor memory usage in JavaScript

I am trying to allocate memory in JavaScript to study memory leak/consumption using the code snippet below. However

performance.memory.usedJSHeapSize 

always shows the same number, 10000000 in my case. How come that number never changes despite dynamically creation of elements and attaching to DOM ?

I need a JavaScript snippet to create memory leak and monitor the usage using performance.memory.usedJSHeapSize dynamically( or any other functions if exists).

I tried this code but performance.memory.usedJSHeapSize remains at 10000000:

<body>
    <p id="memory" style="position: fixed; top:10px; left:10px"></p>
<script>

    setInterval(() => {
        document.getElementById("memory").innerHTML = performance.memory.usedJSHeapSize
    }, 300);
     btn = [];
    let i = 0;
    setInterval(() => {
        for (let j = 0; j < 1000; j++) {
            ++i;
            let k=i;
            btn[k] = document.createElement("BUTTON");
            document.body.appendChild(btn[k]);
            btn[k].innerHTML = k;
            btn[k].addEventListener("click", function () {
                alert(k);
            });
        }
    }, 5000);
</script>
</body>

I already tired the example given in 2013 in this post, but this one no longer create memory leak either.

How do I create a memory leak in JavaScript?



from How to create memory leak and monitor memory usage in JavaScript

No comments:

Post a Comment