자바스크립트 실행 시간 단축

JavaScript를 실행하는 데 시간이 오래 걸리면 여러 가지 방법으로 페이지 성능을 저하시킵니다.

• 네트워크 비용

  바이트가 높을수록 다운로드 시간이 길어집니다.

• 구문 분석 및 컴파일 비용

  JavaScript는 기본 스레드에서 구문 분석되고 컴파일됩니다. 메인 스레드가 사용 중일 때 페이지는 사용자 입력에 응답할 수 없습니다.

• 실행 비용

  JavaScript는 기본 스레드에서도 실행됩니다. 페이지에서 실제로 필요로 하기 전에 많은 코드를 실행하면 사용자가 페이지 속도를 인식하는 방식과 관련된 주요 측정 항목 중 하나인 상호 작용까지의 시간도 지연됩니다.

• 메모리 비용

  JavaScript가 많은 참조를 보유하고 있다면 잠재적으로 많은 메모리를 소모할 수 있습니다. 페이지가 많은 메모리를 사용하면 버벅거리거나 느려지는 현상이 나타납니다. 메모리 누수로 인해 페이지가 완전히 정지될 수 있습니다.

# Lighthouse JavaScript 실행 시간 감사가 실패하는 방식

Lighthouse는 JavaScript 실행이 2초 이상 걸리면 경고를 표시합니다. 실행 시간이 3.5초를 초과하면 감사가 실패합니다.

Lighthouse는 실행 시간에 가장 큰 영향을 미치는 요인을 식별하는 데 도움이 되도록 페이지에서 로드하는 각 JavaScript 파일을 실행, 평가 및 구문 분석하는 데 소요된 시간을 보고합니다.

# JavaScript 실행 속도를 높이는 방법

• Only send the code that your users need by implementing code splitting.
• Minify and compress your code.
• Remove unused code.
• Reduce network trips by caching your code with the PRPL pattern.

For other ways to improve page load, check out the Performance audits landing page.

# 참고 자료

JavaScript 실행 시간 감소 감사를 위한 소스 코드