IT TIP

JavaScript 객체를 파괴하는 방법?

itqueen 2020. 10. 23. 19:50
반응형

JavaScript 객체를 파괴하는 방법?


최근에 너무 많은 메모리를 소비하고 초당 10MB 씩 증가하는 애플리케이션 중 하나를 발견했습니다.

그래서 저는 자바 스크립트 객체와 변수를 파괴하는 가장 좋은 방법을 알고 싶습니다. 그래서 메모리 소비는 줄어들고 FF는 파괴되지 않습니다.

페이지를 다시로드하지 않고 매 8 초 간격으로 두 개의 JavaScript를 호출하고 있습니다.

function refresh() {
    $('#table_info').remove();
    $('#table').hide();
    if (refreshTimer) {
        clearTimeout(refreshTimer);
        refreshTimer = null ;
    }
    document.getElementById('refresh_topology').disabled=true; 
    $('<div id="preload_xml"></div>').html('<img src="pic/dataload.gif" alt="loading data" /><h3>Loading Data...</h3>').prependTo($("#td_123"));
    $("#topo").hide();
    $('#root').remove();
    show_topology();
}

어떤 변수로 인해 메모리 오버 헤드 와 메서드가 해당 프로세스의 실행을 중지 하는지 어떻게 알 수 있습니까?


다음과 같이 모든 코드를 하나의 네임 스페이스에 넣을 수 있습니다.

var namespace = {};

namespace.someClassObj = {};

delete namespace.someClassObj;

delete키워드를 사용하면 속성에 대한 참조가 삭제되지만 낮은 수준에서 JavaScript GC (가비지 수집기)는 회수 할 개체에 대한 자세한 정보를 얻습니다.

Chrome 개발자 도구를 사용하여 앱의 메모리 프로필과 축소해야하는 앱의 개체를 가져올 수도 있습니다.


개체를 삭제할 수 없으며 더 이상 참조가 없을 때 제거됩니다. 를 사용하여 참조를 삭제할 수 있습니다 delete.

그러나 객체에 순환 참조만든 경우 몇 가지를 분리해야 할 수 있습니다.


기존 답변은 문제를 해결하기위한 솔루션과 질문의 후반부를 제공했지만 굵게 표시된 질문의 전반부에서 자기 발견 측면에 대한 답변은 제공하지 않습니다. "어떤 변수가 원인인지 어떻게 알 수 있습니까? 메모리 오버 헤드 ...? "

3 년 전에는 강력하지 않았을 수 있지만 Chrome Devevloper 도구 " 프로필 "섹션은 이제 매우 강력하고 기능이 풍부합니다. Chrome 팀은이 를 사용하는 방법과 자바 스크립트에서 GC (가비지 수집)가 작동 하는 방식에 대한 통찰력있는 기사가지고 있습니다.이 질문의 핵심입니다.

delete기본적으로 Yochai Akoka가 현재 받아 들인 답변의 뿌리 이므로 delete가 무엇을하는지 기억하는 것이 중요합니다. 다음 두 답변에서 GC 작동 방식의 개념과 결합되지 않으면 관련이 없습니다. 객체에 대한 기존 참조가 있으면 정리되지 않습니다. 대답은 더 정확하지만 '삭제'를 작성하는 것보다 더 많은 생각이 필요하기 때문에 아마도 감사하지 않을 것입니다. 예, 가능한 해결책 중 하나는를 사용하는 것일 수 delete있지만 메모리 누수에 대한 다른 참조가 있는지 여부는 중요하지 않습니다.

sensitiveLatticeworkFever는 순환 참조를 적절하게 언급하며 Chrome 팀 문서는 원인을 확인하는 도구뿐만 아니라 훨씬 더 명확성을 제공 할 수 있습니다.

때문에 delete여기에 언급 된, 또한 자원을 제공하는 것이 유용 할 수 있습니다 삭제 이해 . js의 GC와 실제로 관련된 실제 솔루션에는 들어 가지 않지만.


모든 임시 객체가 전역 네임 스페이스 / 전역 객체 속성 대신 클로저 내부에 위치하도록 코드를 구성하고 작업을 마치면 범위를 벗어납니다. 나머지는 GC에서 처리합니다.


나는 이와 같은 문제에 직면했고 문제가있는 개체의 자식들의 innerHTML을 단순히 변경하는 아이디어를 가지고 있었다.

adiv.innerHTML = "<div...> the original html that js uses </div>";

더러워 보이지만 작동하면서 내 생명을 구했습니다!

참고 URL : https://stackoverflow.com/questions/10246215/how-to-destroy-a-javascript-object

반응형