ABOUT ME

-

Today
-
Yesterday
-
Total
-
  • 자바스크립트의 메모리 관리
    Front-end/Javascript 2022. 6. 29. 19:38

    메모리란? 

    하드웨어에서 메모리는 다수의 flip flop으로 구성되어 있습니다. 각각의 flip flop은 unique identifeier를 통해 위치를 알 수있기 때문에 읽거나 쓰는것이 가능해집니다. 

     

    - text영역이 코드가 들어가는 영역입니다. 컴파일이 끝난 기계어가 들어갑니다. 프로세스가 종료될때까지 계속 유지됩니다. 

    - data영역은 전역 변수, 정적변수, 배열 등이 저장되어 프로그램이 끝날때까지 존재합니다. 

          * initialized data (data) - 런타임 이전에 초기화 

          * unitialize data (bss)  - 런타임 이후 초기화 

    - heap 영역은 프로그래머가 동적으로 사용하는 영역입니다. 런타임시 크기가결정됩니다. 

    - stack 영역은 지역변수, 매개변수들이 저장되고 함수 호출시 사용되고 종료시 반환됩니다. 

       * heap 영역이 커지면 stack 영역이 작아지고 그 반대 상황도 동일합니다. 

     

    메모리 생명 주기

    MEMORY ALLOCATION => MEMORY USAGE => MEMORY RELEASE 

    -메모리 할당 : 운영체제가 메모리를 할당합니다. 저수준 언어( ex) C , C++) 에서는 명시적으로 처리해줘야하나 고수준 언어에서는 자동으로 메모리를 할당하고 필요가 없어지면 가비지 컬렉션에 의해 해제됩니다. 

    -메모리 사용 : 메모리를 실제로 사용하는 단계입니다. 읽기와 쓰기가 이루어집니다. 

    -메모리 해제 : 더이상 필요하지 않는 메모리를 해제합니다. 

     

     

    자바스크립트의 메모리 관리 - 가비지 컬렉션

    자바스크립트에서 객체,문자 등이 생성될때 메모리가 할당됩니다.
    자바스크립트 엔진 내에서 가비지 컬렉터가 끊임없이 동작합니다. 더 이상 사용되는 곳이 없을때 자동으로 메모리를 반환합니다. 

    - 도달 가능한(reachable) 값은 메모리에서 삭제되지 않습니다. 

        * 현재 함수의 지역 변수와 매개변수

        * 중첩 함수의 체인에 있는 함수에서 사용되는 변수와 매개변수

        * 전역 변수

     - 이러한 값들이 참조하는 값이나 체이닝으로 참조할수 있는 값은 도달 가능한 값이 됩니다. 

     

     

    메모리 누수란? 

    더이상 사용되지 않거나 필요하지 않음에도 어떠한 이유에 의해 OS에 다시 리턴되지 않고 불필요하게 메모를 사용되는것을 뜻합니다. 

     

    메모리 누수는 언제 일어날까

    -클로저의 잘못된 사용 

    위의 예시처럼 outer function에 선언되어있는 변수가 내부의 inner function에서 사용이 가능하거나 중첩된 함수에서 사용/참조되지 않아도 메모리에 남아있다면 메모리 누수가 발생한다. 

     

    -전역변수

    -타이머 혹은 콜백함수

    -DOM에서 벗어난 요소를 참조할때 

    -이벤트 리스너

    -캐시 

     

     

     

     

     

    참고한 글 : 

    https://blog.sessionstack.com/how-javascript-works-memory-management-how-to-handle-4-common-memory-leaks-3f28b94cfbec 

    https://developer.mozilla.org/ko/docs/Web/JavaScript/Memory_Management 

    https://www.lambdatest.com/blog/eradicating-memory-leaks-in-javascript/ 

    'Front-end > Javascript' 카테고리의 다른 글

    tc39 92nd, 93nd meeting  (0) 2022.09.27
    Lexical 🤪  (0) 2022.09.07
    class 내부 메서드에서 화살표 함수를 사용한다면  (0) 2022.05.12
    화살표함수와 this  (0) 2022.04.30
    클래스 (3)  (0) 2022.04.29
Designed by Tistory.