자바스크립트 어플리케이션 메모리 관리라기 보다 가비지 컬랙션(Gabege Collection)과 클로져(closure)와 순환참조(circular reference) 의 관계에 대한 글에 가깝습니다.
중간 중간 정리하면서 가비지 컬랙션에 대한 참조한 블로그가 있었는데 까묵었습니다. ^-^;
간단 명료하게 결론부터 정리합니다.
Javascript RIA 개발 시 간과해서는 안되는 중요한 부분중에 한가지 입니다.
바로 메모리 관리 Memory Management입니다.
이미 여러 javascript로 RIA 개발 경험이 있는 개발자라면 뼈저리게 느끼고 있을 것입니다.
못느꼇다면 꼭 한번 브라우저를 띄우고 개발해 놓은 요소들을 메모리 테스트를 해보시기 바랍니다.
그리고 윈도우 어플리케이션 개발자라면 이 메모리 관리에 대해서 매우 예민한 부분이 아닐 수 없습니다. 윈도우 어플리케이션도 아닌데 메모리 관리를 해줘야 한다니 그냥 웃고 넘어갈 분들도 계시겠지만 RIA 개발하려는 모든 분들께 메모리 관리에 대한 중요성을 전달해 주고 싶습니다.
가비지 컬랙션(Garbage Collection) ?
힙heap영역에 할당된 더 이상 사용되지 않는 메모리인 가비지garbage를 가비지 컬랙터garbage collector가 다른 객체가 사용할 수 있도록 정리하는 것을 말합니다.
객체가 가리키는 참조 변수가 null이 지정되거나 객체가 더 이상 참조하지 않게 되었을 때 가비지 컬랙터의 후보가 되며 이러한 객체들은 가비지 컬랙터에 의해 메모리를 반환하게 됩니다.
가비지 컬랙션의 대상
1. 객체에 null 값이 대입되었을 때
e.g. var dat = new Date();
dat = null;
2. 참조변수에 다른 객체가 대입될 때
e.g. var dat = document.getElementById(‘rhio’);
dat = 29;
3. 메소드의 수행이 끝났을 때
e.g. function func() {
var dat = document.getElementById(‘rhio’);
//do something
}
가비지 컬랙션과 순환참조에 대한 좋은 글 옷장수님 블로그#가비지 컬렉션의 이해
자바의 가비지 컬렉션은 자바가상머신Java Vitural Machine에서 알아서 처리하지만 개발자에 의해 직접 가비지 컬랙션을 수행 요청을 할 수 있습니다. 하지만 javascript의 경우에는 따로 개발자에 의해 가비지 컬랙션의 작업 수행 요청할 수 있는 매커니즘이 존재하지 않습니다.
Javascript는 주기적으로 가비지 컬랙션의 대상에 대한 리소스 반환 작업을 수행하게 됩니다.
IE 브라우저의 경우 순환참조Circular Reference 발생과 클로져 형성으로 메모리 누수에 대한 심각한 문제가 시작됩니다. Javascript에서의 순환참조(Circular Reference)라 함은 Javascript 객체가 DOM 객체에 대한 레퍼런스를 포함하고 그 DOM 객체가 javascript 객체의 레퍼런스를 포함할 때를 말합니다.
위의 문단이 자바스크립트에만 순환참조가 있다라는 글로 오해될 수 있을 것 같아 살짝 수정 및 아래 내용을 추가합니다. 일반적인 순환참조(circular refrenece)에 대한 설명이 더욱 필요할 것 같네요. (옷장수님이 의견 주셨습니다.)
일반적인 순환참조(Circular Reference)란?
참고 :
http://en.wikipedia.org/wiki/Circular_reference
http://en.wikipedia.org/wiki/Reference_counting
위의 예제는 흔히 우리가 알고 있는 javascript의 순환참조가 발생되면서 메모리 누수현상을 단편적으로 설명할 수 있는 예시가 됩니다.
div는 DOM 객체의 레퍼런스를 담고 있습니다. 이 DOM 객체를 outerFn 가 첫번째 인자로 취하여 DOM 객체에 func라는 프로퍼티property 에 javascript의 익명함수anonymous function 를 참조reference하게 합니다.
이 자체가 메모리 누수라 할 수는 없지만, 위와 같은 패턴은 경우에 따라(위와 같은 작업이 반복 적으로 수행될 때) 심각한 누수 현상을 발생할 수 있습니다. 이 말은 곧 가비지 컬랙션에 의해서 메모리 반환을 하지 못하는 상황에 빠지게 됩니다.
Javascript의 가비지 컬랙터의 경우 클로져가 형성된 것들을 관리하며 혼돈하지 않아 가비지 컬랙션에 대해 메모리 반환을 하지만 불행히 IE의 경우 DOM을 JScript가 관리하지 않아 위의 예시와 같은 순환참조와 클로져에 대해 몹시 둔감합니다. 그만큼 메모리 누수 현상이 매우 심각합니다.
이번 IE8이 릴리즈 되면서 그에 대한 마이그레이션 팁이 나왔습니다. 그 역시 DOM과 Javascript의 순환참조에 대한 이슈를 대부분 언급하고 있습니다. 그에 대한 테스트와 테스트 결과에 대해서 다음에 간단한 포스팅을 하도록 하겠습니다.
참고
http://www.crockford.com/javascript/memory/leak.html
http://www-128.ibm.com/developerworks/web/library/wa-memleak/
'JavaScript' 카테고리의 다른 글
| JavaScript has staying power; Used in Stargate (3) | 2008/04/10 |
|---|---|
| Super Mario in 14kB Javascript (0) | 2008/04/10 |
| Javascript Application(RIA) Memory Management (2) | 2008/04/09 |
| Closure in javascript (자바스크립트에서 클로져는 무엇인가?) (10) | 2008/03/17 |
| Data Caching Structure in Ajax(XHR) Pattern (2) | 2008/03/14 |
| Opera - Slice method of Array Object too bad -_-^ (4) | 2008/02/27 |
