Javascript에서 성능을 측정하는 방법(실행속도 측정)

들어가며

프로젝트를 진행하는 중에 브라우저 화면을 그대로 PDF로 만들어야 하는 업무가 생겼다.

'html2pdf'라는 오픈소스를 통해 구현은 간단히 끝났지만 속도가 느리다는 새로운 문제가 발생했다.

그러다 문득 'JS에서는 속도를 어떻게 측정하지?'라는 생각이 들어 이 포스팅을 작성하게 되었다.(PDF 생성의 속도 문제를 해결하는 방법은 여기서는 생략한다)

 

JS에서 성능 측정 방법

console.time(id: string)
console.timeEnd(id: string)

두 함수는 짝을 이뤄 사용한다. 측정을 시작할 때는 console.time() 함수에 고유한 값을 문자열로 넣어주면 된다.

마찬가지로 측정을 끝낼 때는 console.timeEnd() 함수에 동일한 고유값을 문자열로 넣어준다.

 

console.time('createPDF')

createPdf()	// 성능을 측정할 함수

console.timeEnd('createPDF')

 

반응형

마치며

개인적으로 FE에서의 작업시간은 네트워크 환경에 영향을 받는 경우가 많아 유의미한 값을 얻기 힘들다고 생각했었다.

그러나 그것과는 별개로 측정할 수 있는 방법이 있다는 것, 그리고 이것을 알게 되었다는 것은 좋은 경험이라고 생각한다.

 

여러분도 본인이 개발한 함수가 서버와 통신하는데 얼마나 걸리는지, 차트가 렌더링 될 때 걸리는 시간은 몇 초나 되는지 등 다양한 분야에서 활용하길 바란다.