메모리 누수

DOM 메모리 누수

DOM 항목을 가리키는 변수가 이벤트 콜백 외부에 선언된 경우 해당 DOM 항목을 제거하더라도 해당 항목은 여전히 메모리에 남게 된다.

// DOM leak:
var one = document.getElementById("one");
var two = document.getElementById("two");
one.addEventListener('click', function(){
    two.remove();
    console.log(two); // will print the html even after deletion
});

// fix for above
var one = document.getElementById("one");
one.addEventListener('click', function(){
    var two = document.getElementById("two");
    two.remove();
});

// unregister the callback
var one = document.getElementById("one");
one.addEventListener('click', function(){
    var two = document.getElementById("two");
    two.remove();
});
one.removeEventListener('click');

 

객체 참조 제한하기

이러면 안돼

var test = {
    prop1: 'test'
}

function printProp1(test){
    console.log(test.prop1);
}

printProp1(test); //'test'

이래야 돼

var test = {
    prop1: 'test'
}

function printProp1(prop1){
    console.log(prop1);
}

printProp1(test.prop1); //'test'

delete test.prop1; //이건 그냥 삭제하는법