performance.now()javascript 메모리 누수 체크javascript 메모리 해제javascript 메모리 사용량 확인자바스크립트 메모리 확인

performance.now() 함수를 사용한 코드 성능과 메모리 사용량 최적화

KUKJIN LEE
KUKJIN LEE
2024년 2월 18일
168

코드 실행 시간 측정과 메모리 사용량 확인은 프로그램의 성능을 평가하고 최적화하는 데 중요한 부분입니다. 여기에서 코드 실행 시간을 측정하는 방법과 메모리 사용량을 확인하고 최적화하는 방법에 대해 설명하겠습니다.

코드 실행 시간 측정하기

코드 실행 시간을 측정하려면 performance.now() 메소드를 사용할 수 있습니다. 이 메소드는 현재 시간을 나타내는 타임스탬프를 반환합니다. 코드 실행 시작 시간과 종료 시간의 차이로 실행 시간을 계산할 수 있습니다.

function exampleFunction() {
    // 코드 실행 시작 시간 기록
    const startTime = performance.now();

    // 여기에 코드 실행

    // 코드 실행 종료 시간 기록
    const endTime = performance.now();

    // 실행 시간 계산 (밀리초로 나타남)
    const executionTime = endTime - startTime;

    console.log(`코드 실행 시간: ${executionTime} 밀리초`);
}

메모리 사용량 확인하고 최적화하기

메모리 사용량을 확인하려면 브라우저의 개발자 도구를 사용할 수 있습니다. Chrome, Firefox, Safari 등 대부분의 브라우저는 메모리 프로파일링 기능을 제공합니다.

  1. Chrome 개발자 도구를 이용한 메모리 프로파일링
    • Chrome 브라우저에서 F12 키를 눌러 개발자 도구를 엽니다.
    • "Performance" 탭으로 이동한 후 "Record" 버튼을 눌러 성능 프로파일링을 시작합니다.
    • 코드를 실행한 후 "Stop" 버튼을 눌러 프로파일링을 종료합니다.
    • "Memory" 섹션에서 메모리 사용량과 관련된 정보를 확인할 수 있습니다.
  1. 메모리 누수 확인
    • 메모리 누수는 프로그램에서 의도하지 않은 메모리 사용으로 인해 메모리가 지속적으로 늘어나는 현상을 의미합니다. 개발자 도구의 "Memory" 탭에서 메모리 스냅샷을 찍어 누수 여부를 확인할 수 있습니다.

예시 코드를 보면 코드 실행 시간 측정을 통해 코드 성능 향상과 메모리 최적화를 할 수 있었습니다.

문자열 연산은 불변성을 유지하기 때문에 각 연산마다 새로운 문자열을 만들어야 하는데, 배열을 사용하면 메모리 사용을 줄일 수 있음을 발견할 수 있습니다.

코드의 성능 측정과 메모리 사용량을 확인하며 최적화 작업 수행을 위해서는 이론 부분에서 많은 공부가 필요하다는 걸 깨달았습니다.

#performance.now()#javascript 메모리 누수 체크#javascript 메모리 해제#javascript 메모리 사용량 확인#자바스크립트 메모리 확인#backend