성능 이슈 인지하기 - ChoDragon9/posts GitHub Wiki

성능 최적화를 하기 앞서서 어떤 부분이 성능이 낮은지 인지하는 게 중요하다. 인지 방법은 다음과 같다.

• 웹 사이트 사용자가 느끼는 성능을 체감하고 인지
• 도구를 사용한 인지

웹 사이트 사용자가 느끼는 성능을 체감하고 인지

웹 사이트 사용자가 느끼는 성능을 체감하고 인지하는 것은 사람이 느끼는 성능을 인지하는 부분이다.

웹 사이트 사용자가 느끼는 성능을 체감하고 인지하는 것은 RUM 도구(예: Sentry Performance)를 통해서 인지 가능하다. 웹 사이트에 Beacon 코드를 심어서 사용자의 브라우저를 통해 성능을 측정하고, 측정된 데이터를 수집기에 전송한다. 전송된 데이터를 분석해서 사용자가 어떻게 느끼는지 파악하는 것이다.

도구를 사용한 인지

도구를 사용한 인지는 특정 환경의 상황을 가정하고 성능을 측정하는 것이다.

도구를 사용한 인지는 Chrome DevTools 에서 Performance 기능과 Lighthouse 기능으로 인지 가능하다. 개발자 컴퓨터나 서버에서 성능을 측정할 수 있다.

Chrome DevTools

성능 측정 도구 중 가장 쉽게 접할 수 있는 도구는 Chrome DevTools다. 도구의 사용방법은 성능 측정 도구 | 성능 최적화 | TOAST UI와 Overview | Chrome DevTools | Chrome Developers를 통해 학습할 수 있다.