[IE11] window.open 시 메모리 관리 (about:blank)

[IE11] window.open 시 메모리 관리 (about:blank)

Windows 10 / IE 11 환경에서 메모리 문제로 IE 가 죽는 현상을 개선.

회사에서 MS의 가이드를 받은 내용을 나름대로 정리했다.

우선 IE11의 경우 메모리 1기가 이상이면 죽는다고 보면 된다고 한다.

실제로는 2기가까지도 버티지만, 이론적으로 1기가 미만으로 관리해줘야 한다는 얘기다.

IE11에서 window.open 을 사용할 때 동일한 도메인의 페이지를 여는 경우 하나의 프로세스 안에서 스레드를 늘리게 된다.

이렇게 되면 하나의 프로세스에 대한 메모리가 계속 높아진다.

그런데 window.open 으로 동일하지 않은 새로운 도메인 주소를 열게 되면 새로운 프로세스를 하나 더 늘리게 된다.

따라서 window.open 을 사용할 때 우선 빈 페이지를 열고, 이후 주소값을 바꿔치는 방법을 사용하면, window.open 때마다 프로세스를 늘려 메모리 부하를 분산시킬 수 있다.

<예제>

IE11 에서window.open 으로 특정 페이지를 열면 프로세스가 추가되지 않는다(아래 test1.htm 코드 참고).

반면 IE11 에서 window.open(“about:blank”); 로 빈페이지를 열면 프로세스가 추가된다(아래 test2.htm 코드 참고).

테스트 시 C 드라이브의 파일을 직접 열어서 테스트하지 말고 반드시 웹서버나 WAS를 띄워야 정상적으로 테스트 된다(ex : C:\test\test1.htm 파일을 열어서 하면 안되고, http://localhost/test1.htm 로 테스트 해야 함).

결론은 메모리 문제로 IE 가 죽는 현상을 개선하기 위해서는 window.open 시 window.open(“about:blank”); 로 빈페이지를 열고, 이후 location.href 값을 원하는 페이지 주소로 변경해주는 방식이 유리하다.

1. 일반적인 window.open 방식

test1.htm

<html>
<head>
<title>TEST 1</title>
<script>
    function openWindow() {
        window.open(“test1.htm”);
    }
</script>
</head>
<body>
 <input type=”button” onclick=”openWindow()” value=”OPEN” />
</body>
</html>

 

▲ IE 탭이 1개일 때 iexplore.exe 프로세스 개수 2개

 

▲ IE 탭이 3개일 때 iexplore.exe 프로세스 개수 2개. window.open 했을 때 프로세스 개수가 그대로 유지된다.

2. about:blank 를 사용하는 window.open 방식

test2.htm

<html>
<head>
<title>TEST 2</title>
<script>
    function openWindow() {
        var winObj = window.open(“about:blank”);
        winObj.location.href = “test2.htm”;
    }
</script>
</head>
<body>
 <input type=”button” onclick=”openWindow()” value=”OPEN” />
</body>
</html>



 

▲ IE 탭이 1개일 때 iexplore.exe 프로세스 개수 2개

 

▲ IE 탭이 3개일 때 iexplore.exe 프로세스 개수 4개. window.open 에 따라 프로세스 개수가 늘어났음을 확인할 수 있다.

참고로 크롬과 Edge 의 경우는 현상이 재현되지 않는다. 크롬의 경우 최초 크롬을 하나 띄웠을 때 chrome.exe 프로세스 개수가 7~8개 정도이고, window.open 을 어떤 방식으로 사용하든 프로세스 개수가 유지된다. (Chrome 버전 83.0.4103.97)

Microsoft Edge의 경우도 마찬가지로 최초 Edge를 하나 띄웠을 때 msedge.exe 프로세스 개수가 7~8개 정도이고, window.open 을 어떤 방식으로 사용하든 프로세스 개수가 유지된다. (Miscrosoft Edge 버전 83.0.478.45)