Grafana 대시보드 개요

Sophonz가 수집한 OpenTelemetry 원격 측정 데이터를 Grafana에서 시각화하는 방법을 설명합니다.

Sophonz는 OpenTelemetry 기반으로 트레이스, 메트릭, 로그를 수집합니다. 수집된 데이터는 ClickHouse와 Prometheus에 저장되고, Grafana 대시보드를 통해 실시간으로 시각화할 수 있습니다. v2 관측 가능성 계층에서는 RUM 세션 뷰와 데이터 탐색기가 추가되어 프론트엔드·백엔드 전 구간을 단일 화면에서 확인할 수 있습니다.

데이터 흐름

Sophonz 텔레메트리 데이터는 다음 경로로 Grafana까지 전달됩니다.

SDK (앱) → OpenTelemetry Collector → ClickHouse / Prometheus → Grafana

Sophonz SDK가 앱에서 트레이스·로그·메트릭을 OTLP 형식으로 전송합니다.
OpenTelemetry Collector가 데이터를 받아 배치 처리 후 각 스토리지로 내보냅니다.
- 트레이스·로그 → ClickHouse (sophonz 데이터베이스)
- 스팬 메트릭 → ClickHouse (sophonz_metrics_* 테이블)
- RUM 세션 이벤트 → ClickHouse (또는 S3 호환 객체 스토리지, 리플레이 스냅샷)
Grafana는 ClickHouse 및 Prometheus 데이터소스를 통해 저장된 데이터를 조회하고 대시보드를 렌더링합니다.

프로비저닝된 대시보드

Sophonz 인프라는 세 가지 대시보드를 기본으로 제공합니다. 대시보드는 파일 기반 프로비저닝으로 자동 등록됩니다.

sophonz-service (Web)

웹 SDK를 통해 수집된 브라우저 앱의 성능 지표를 표시합니다.

패널	설명
세션 수	시간 범위 내 고유 세션 수
평균 로딩시간	Document Load 및 렌더링 평균 소요 시간
평균 응답시간	Fetch / XMLHttpRequest 평균 응답 시간
에러 수	수집된 오류 이벤트 건수
응답시간 (Fetch & XHR)	네트워크 요청별 응답시간 분포
응답시간 P50/P95	요청 응답시간의 중앙값 및 95번째 백분위
로딩시간 (Document Load & Render)	페이지 로딩 및 렌더링 소요 시간
로딩시간 P50/P95	로딩시간의 중앙값 및 95번째 백분위
에러 목록	오류 메시지·유형 상세 테이블
화면별 성능	화면(route) 단위 성능 비교
트레이스 목록	최근 트레이스 ID 및 지속 시간 목록

sophonz-service-ios (iOS)

iOS SDK로 수집된 네이티브 앱 성능 지표를 표시합니다. 패널 구성은 Web 대시보드와 동일하며, iOS 앱의 화면 전환·네트워크 요청·오류를 추적합니다.

sophonz-service-test-payload

SDK 연동 테스트 및 데이터 수신 검증 목적으로 사용하는 대시보드입니다. 실 서비스 모니터링보다는 초기 설정 확인과 페이로드 구조 검증에 활용합니다.

RUM 세션 뷰

NOTE — v2 계획

RUM 세션 뷰는 v2 관측 가능성 로드맵의 일부입니다. 현재는 기반 수집 파이프라인이 준비되어 있으며, 전용 대시보드 패널은 순차적으로 추가됩니다.

RUM Session 서비스는 프론트엔드 SDK로부터 클릭·내비게이션·네트워크·오류 이벤트를 세션 단위로 수집합니다. Grafana에서는 다음을 확인할 수 있습니다.

세션 리플레이 — 사용자의 화면 동작을 시간 순으로 재생합니다.
퍼널·리텐션 분석 — 화면 전환 흐름과 이탈 지점을 시각화합니다.
세션↔트레이스 연결 — 세션 ID와 trace_id를 조인해 프론트엔드 행동과 백엔드 트레이스를 한 화면에서 확인합니다.

세션 이벤트는 ClickHouse에 저장되며, 리플레이 스냅샷은 S3 호환 객체 스토리지에 보관됩니다.

데이터 탐색기

NOTE — v2 계획

데이터 탐색기 통합 UI는 v2에서 제공될 예정입니다. 현재 Grafana의 ClickHouse 쿼리 인터페이스를 통해 동일한 데이터에 접근할 수 있습니다.

Data Explorer는 OTel 원천 데이터(트레이스·메트릭·로그)에 대한 구조화 쿼리를 제공하는 내부 서비스입니다. Grafana 대시보드는 이 서비스를 통해 다음 기능을 제공합니다.

TraceQL 유사 쿼리로 특정 세션·유저·커스텀 속성 기반 트레이스 검색
서비스 의존성 그래프(서비스 맵) 시각화
파생 지표(에러율, p95 지연) 캐싱 및 차트 렌더링

Sophonz Dashboard는 Data Explorer API를 통해 동일한 데이터를 소비하므로, Grafana와 Sophonz 대시보드 간 차트가 일관성을 유지합니다.

Sophonz 대시보드와의 관계

Grafana는 SRE·운영자를 위한 전문 쿼리 도구입니다. 개발자와 PM은 Sophonz Dashboard에서 동일한 관측 데이터를 제품 UI로 소비합니다.

Sophonz Dashboard (제품 UI)
      ↕ Data Explorer API
Grafana (전문 쿼리 / 알림)
      ↕ ClickHouse / Prometheus
OTel Collector → 수집 파이프라인

Grafana Provisioning 서비스는 Sophonz 서비스·네임스페이스 메타를 Grafana 데이터소스·폴더·대시보드로 자동 투영하며, Sophonz Dashboard에 임베드할 차트 URL도 발급합니다.

대시보드 접근

Grafana에는 https://grafana.example.com으로 접속합니다. 인증은 Keycloak OAuth2/OIDC를 통해 처리되며, Sophonz 계정으로 로그인하면 자동으로 Grafana 세션이 시작됩니다.

NOTE — 자동 새로고침

프로비저닝 설정(updateIntervalSeconds: 10)에 따라 대시보드 파일이 추가·변경되면 Grafana가 10초 이내에 자동으로 반영합니다. 별도의 재시작 없이 새 대시보드를 추가할 수 있습니다.

데이터소스

데이터소스	플러그인	용도
ClickHouse	`grafana-clickhouse-datasource`	트레이스, 로그, 스팬 메트릭 조회 (기본)
ClickHouse-Altinity	`vertamedia-clickhouse-datasource`	보조 ClickHouse 쿼리
Prometheus	내장	인프라·애플리케이션 메트릭
PostgreSQL	내장	애플리케이션 관계형 데이터

대시보드 프로비저닝 방법과 데이터소스 설정 파일 내용은 대시보드 설정을 참고하세요.