JavaScript_javascript 팁의 동적 로딩으로 인한 메모리 누수 방지

스크립트 자원을 해제하기 위해 일반적으로 반환 후 몇 가지 추가 처리가 수행됩니다.

코드 복사 코드는 다음과 같습니다.

script = document.createElement('script' );
script.src =
'http://example.com/cgi-bin/jsonp?q=생명의 의미는 무엇입니까?'
script.id = 'JSONP'; 🎜>script .type = 'text/javascript';
script.charset = 'utf-8'
// 태그가 헤드에 추가되면 자동으로 로드되어 실행됩니다.
var head = document.getElementsByTagName('head')[0];
head.appendChild(script)

실제로 많은 인기 JS 라이브러리가 이 방법을 사용하여 A scritp를 생성합니다. 태그는 ID를 할당한 후 스크립트(예: YUI get())를 로드하고 로드 및 콜백 후에 태그를 삭제합니다. 문제는 이러한 스크립트 태그를 지우면 브라우저가 단순히 태그 노드를 제거한다는 것입니다.

코드 복사 코드는 다음과 같습니다.

var script = document.getElementById('JSONP ');
script.parentNode.removeChild(script);

브라우저가 이 태그 노드를 제거하면 노드의 JavaScript 리소스에 대해 가비지 수집을 수행하지 않습니다. 노드의 JavaScript 리소스가 제거되는 경우 레이블 노드 외에도 스크립트 레이블 노드의 내용을 수동으로 지워야 합니다.

code 코드는 다음과 같습니다.

// 이전 스크립트 태그를 제거합니다.
var script; while (script = document.getElementById( 'JSONP')) {
script.parentNode.removeChild(script);
// 브라우저는 이러한 속성이 가리키는 객체를 재활용하지 않습니다.
//메모리 누수를 방지하기 위해 수동으로 삭제합니다. 🎜>for (var prop in script) {
delete script[prop]}
}