사용자 시간 표시 및 측정

User Timing API란 무엇인가요?

우수한 사용자 환경을 위해서는 빠르고 반응성이 우수한 웹 앱을 만드는 것이 중요합니다. 실적 개선의 첫 번째 단계는 시간이 어디에 지출되는지 파악하는 것입니다.

User Timing API를 사용하면 앱의 자바스크립트 성능을 측정할 수 있습니다. JavaScript에 API 호출을 삽입한 다음 코드를 최적화하는 데 사용할 수 있는 상세한 타이밍 데이터를 추출하면 됩니다. API를 사용하거나 Chrome DevTools 타임라인 기록에서 데이터를 확인하여 자바스크립트에서 이러한 데이터에 액세스할 수 있습니다.

사용 방법에 관한 간단한 소개는 User Timing API 페이지에서 확인하세요.

Lighthouse에서 사용자 시간 데이터를 보고하는 방법

앱에서 User Timing API를 사용하여 표시 (타임스탬프)와 측정값 (표시 간 경과 시간 측정값)을 추가하면 Lighthouse 보고서에 표시됩니다.

Lighthouse User Timing 표시 및 측정 감사 스크린샷

Lighthouse는 Chrome의 트레이스 이벤트 프로파일링 도구에서 User Timing 데이터를 추출합니다.

이 감사는 통과 또는 실패 테스트로 구성되지 않습니다. 앱 성능을 측정하는 데 도움이 되는 유용한 API를 발견할 기회입니다.

스택별 안내

React

Profiler API를 사용하는 React DevTools 프로파일러를 사용하여 구성요소의 렌더링 성능을 측정합니다.

자료