IMQA에서는 실시간으로 수많은 성능 데이터를 수집, 시각화하여 보여드리고 있는데요. 성능 개선을 위해선 이 데이터를 바르게 읽고, 이해하는 것이 중요합니다.
유료 버전은 스택 레벨의 분석까지 가능하기 때문에 훨씬 많은 데이터를 확인할 수 있습니다. 시간을 조금만 투자하셔서 데이터 읽기 시리즈를 천천히 보고 익혀보세요. 더욱 효과적으로 IMQA를 사용하실 수 있을 거예요! 앞으로 총 3편으로 안내될 MPM 데이터 읽기 시리즈를 확인하시고 성능 개선을 시작해 보세요.
아래 3편으로 구성되며, 이번 시간에는 실시간 모니터링에 대해 안내해 드립니다.
- 실시간 모니터링
- 전체 모니터링(통계)
- 웹뷰 타임라인
* 본 포스팅의 경우, 주요 내용을 다룬 요약본으로 전체 버전은 이용자 가이드 내 IMQA 데이터 읽기 페이지에서 확인하실 수 있습니다.
1. 시계열 그래프 읽기
실시간 모니터링을 위해선 대시보드를 확인이 필요합니다. 최근 30분 동안의 현재 이용자&실행 수, 크래시 발생 수, 화면 로딩시간, 응답시간, CPU와 메모리의 평균과 하위 5%를 나타낸 것입니다. 이를 통해 전체 평균과 하위 5%의 평균을 확인할 수 있고, 성능 저하 구간 및 변동 추이를 확인・비교할 수 있습니다. 그럼, 위치에 따라 그래프를 어떻게 해석하는지 자세히 알아보겠습니다.
📌 공통 확인 사항
- 전체 평균과 하위 5% 평균 확인
- 차이가 적으면 대부분 사용자가 비슷한 성능을 경험했다고 판단
- 차이가 크면 특정 사용자가 좋지 않은 성능을 경험했다고 판단
- 변동 추이 확인
- 변동 추이에 큰 변화가 없다면 최근 30분 내 동일한 현상이 지속되고 있음을 의미
- 기준치 확인
- 그래프가 기준치 이상일 경우, 성능이 좋지 않은 것으로 빠른 해결 필요
- y축이 ‘0’에 가까울수록 성능이 좋다는 것을 의미하나, 숫자가 크다면 대다수의 사용자가 성능저하를 겪고 있는 상황일 수 있음
위 공통 사항은 시계열 그래프로 표시된 성능 지표 현황을 바르게 이해하기 위해 반드시 확인해야 할 항목입니다. 아래 그래프는 가장 이상적인 형태의 그래프로, 실시간 그래프와 비교하여 성능 현황을 파악해 보세요!
가장 이상적인 그래프
가장 이상적인 형태로, 대부분의 사용자가 좋은 성능을 경험했음을 의미합니다.
이러한 그래프가 유지될 수 있도록 모니터링해 주세요!
그렇다면 관리가 필요한 그래프는 어떤 형태일까요? 몇 가지 케이스 별로 살펴보았습니다.
Case #1 - 특정 사용자의 성능 저하
특정 구간에서 하위 5%가 기준치를 넘은 것을 확인할 수 있는데요. 특정 사용자만 느린 로딩 시간을 경험한 것으로, 특정 사용자/사용 환경 대상으로 빠른 개선이 필요합니다.
Case #2 - 전반적인 성능 저하
모든 데이터가 기준치 이상으로, 앱 사용자 모두 느린 로딩시간으로 불편함을 겪고 있네요! 느린 화면 로딩시간은 사용자 이탈의 주요 원인이 되므로 빠른 개선이 필요합니다.
Case #3 - 데이터 미수집
전반적으로 데이터의 폭이 큰 것을 확인할 수 있는데요. 앱 성능이 고르지 못하다고 판단할 수 있어요! 또한, 특정 구간에서는 장애로 인해 데이터가 수집되지 않은 것일 수도 있기 때문에 빠른 개선이 필요합니다.
이렇게 관리하세요!
연계 분석을 통한 원인 분석
- 화면 로딩 시간이 느리다는 것 = 사용자의 화면이 늦게 뜬다는 최종 결과
- 다른 성능과 연계하여 원인 분석이 필요함
- 응답시간과 메모리의 경우 이상적인 그래프와 유사함
- CPU의 경우 사용량이 많은 것으로 확인되므로 CPU가 화면 로딩시간을 지연시키는 원인일 수 있다고 분석할 수 있음
2. 화면 카드 데이터 읽기
빨간색으로 표시되는 문제 발생률이 높은 화면부터 확인하시는 경우가 많은데요. 아래 예시를 통해 성능 데이터 확인 우선순위를 정해보는 방법을 살펴보세요.
- 문제 발생률: ➊↓, ➋↑
- 방문률: ➊↑, ➋↓
1번 화면의 경우 2번 화면에 비해 더 많은 사용자가 방문하였기 때문에 더 많은 사용자가 성능 문제를 겪고 있을 수 있습니다.
따라서 방문율 순으로 화면을 분석할 경우, 문제 발생률이 비슷하다면 좌측 상단에 가까운 화면부터 확인하는 것이 좋습니다. 문제 발생률, 하위 5%, 평균 순으로 정렬하여 분석할 때도 방문율을 함께 고려하여 우선순위를 정해 보세요.
빨간색이면 무조건 먼저 확인? ❌
방문율을 고려하여 우선순위 정하기! ⭕️
3. 히트맵 이해하기
해당 화면 카드를 클릭하시면 선택한 화면별 성능 현황을 30분 단위로 상세하게 확인할 수 있습니다.
화면별 성능 분석에서는 주요 성능 정보가 히트맵으로 표기됩니다. 히트맵은 화면별 성능 분석 외 '통계>구간 분석'에서도 많이 보실 데이터이므로 지금 데이터를 이해하는 방법을 익혀보세요.
(1) 어떤 데이터부터 확인해야 할까?
<화면 로딩시간>
- 기준치 이상: 빨강
- 기준치 이하: 파랑
히트맵에서 가장 위에 있는 진한 셀을 먼저 확인하시는 경우가 종종 있는데요. 다음 항목에 따라 분석 우선순위를 정해보세요.
- 세로축 확인
데이터에 따라 기준치에 가까운 값도 가장 위에 표기될 수 있습니다. 따라서 세로축의 값을 확인하고 기준치에서 얼마나 벗어났는지 확인해 보세요. - 데이터 수 확인
셀의 흐리고, 진한 색상 농도는 같은 시간대의 데이터 수로 구분됩니다. (데이터 수는 셀을 마우스 오버로 확인 가능합니다.)
위의 예시 이미지의 경우, 네이티브 화면 로딩시간의 최대값은 약 2,400ms, 웹뷰 화면 로딩시간은 최대값은 약 68,400ms로 매우 차이가 납니다. 또한 데이터 수도 흐린색인 웹뷰 화면 로딩시간 데이터가 진한 색의 네이티브 화면로딩 시간보다 더 많습니다. 따라서 이 경우, 네이티브 화면 로딩시간보다 웹뷰 화면 로딩시간을 먼저 확인하여 개선하는 것이 좋습니다.
무조건 진한 빨강색의 셀부터 확인? ❌
전체 값과 데이터 수를 고려하여 우선순위 정하기! ⭕️
(2) 파란색의 응답시간, 문제없을까?
응답시간은 4xx, 5xx 상태 코드는 빨강, 그 외는 파랑으로 나타납니다. 파란색만 있다면 별도의 확인을 하지 않아도 될까요?
위의 이미지 속 셀은 모두 파란색이지만, 네이티브 응답시간의 경우 특정 셀의 응답시간은 약 16,300ms입니다. 이 경우, 상세 확인을 통해 문제의 원인을 파악해야 합니다.
모든 셀이 파랑이여도 세로축 확인,
응답시간이 긴 부분은 상세 확인 필요!
(3) 특정 시간대의 문제 발생?
위의 이미지와 같은 히트맵의 경우, 특정 시간대(19:40)에 전반적으로 문제가 발생한 것을 확인할 수 있는데요.
해당 시간대에 서버, 통신사 문제 등 외부적 요인이 있을 가능성이 있으므로 응답시간 히트맵을 같이 확인하는 것이 좋습니다. 또한 상세 분석 팝업을 통해 특정 고객만의 문제가 아닌, 해당 시간대의 이용 고객들의 문제인지 확인이 필요합니다.
💡 화면 로딩시간이 길어지는 현상은 응답시간, CPU, 메모리 사용량 같은
다른 성능 지표가 원인일 가능성이 높으니 같이 확인하는 것이 좋음
특정 시간대 전체를 드래그하여 성능 상세 분석 확인!
3. 주요 성능 정보 확인하기
히트맵에서 셀을 드래그하거나 클릭하면 네이티브 스택 분석, 웹 리소스 분석을 확인할 수 있는데요. 팝업 상단의 디바이스 정보 리스트에서 1차적으로 성능 문제를 확인해 보세요.
특정 페이지, 앱 버전, OS 버전, 디바이스, 통신사 등에 문제가 발생하는지 확인할 수 있습니다. 또한 해당 디바이스에 대한 이용 흐름은 '사용자 행동분석'을 통해 아래와 같이 확인할 수 있습니다.
시계열 그래프, 화면 카드, 히트맵은 실시간 모니터링의 주요 시각화 데이터로 이 3가지를 잘 읽혀두시면 쉽게 실시간 모니터링이 가능하실 거예요!
A/B 대시보드의 데이터는 다양한 예시를 통해 설명한 포스팅을 안내해 드립니다. 이것도 꼭 확인해 주세요!
데이터를 읽는 방법을 포함하여 IMQA에 대해 궁금하신 사항은 언제든지 말씀해 주세요! (아래 이미지를 클릭하시면 채팅창으로 이동합니다.)
