133 lines
2.8 KiB
Markdown
133 lines
2.8 KiB
Markdown
|
# ✅ 성능 메트릭 수집 테스트 성공
|
||
|
|
|
||
|
|
**테스트 ID**: Performance-Metrics-Test | **실행**: 2026-01-31 11:28:19 | **결과**: PASS
|
||
|
|
|
||
|
|
---
|
||
|
|
|
||
|
|
## 📊 테스트 요약
|
||
|
|
|
||
|
|
| 항목 | 결과 |
|
||
|
|
|------|------|
|
||
|
|
| 성능 모니터링 초기화 | ✅ 정상 |
|
||
|
|
| 페이지 로드 측정 | ✅ 정상 |
|
||
|
|
| 리소스 메트릭 수집 | ✅ 정상 |
|
||
|
|
| 메모리 사용량 측정 | ✅ 정상 |
|
||
|
|
| DOM 메트릭 수집 | ✅ 정상 |
|
||
|
|
|
||
|
|
---
|
||
|
|
|
||
|
|
## ⚡ 대시보드 성능 메트릭
|
||
|
|
|
||
|
|
### 페이지 로드 성능
|
||
|
|
| 지표 | 시간 | 등급 |
|
||
|
|
|------|------|------|
|
||
|
|
| DOM Content Loaded | 125ms | 🟢 Excellent |
|
||
|
|
| Page Load | 280ms | 🟢 Excellent |
|
||
|
|
| TTFB (Time To First Byte) | 31ms | 🟢 Excellent |
|
||
|
|
| DOM Interactive | 125ms | 🟢 Excellent |
|
||
|
|
|
||
|
|
### Paint 타이밍
|
||
|
|
| 지표 | 시간 | 등급 |
|
||
|
|
|------|------|------|
|
||
|
|
| First Paint | 332ms | 🟢 Good |
|
||
|
|
| First Contentful Paint | 332ms | 🟢 Good |
|
||
|
|
|
||
|
|
### 리소스 사용량
|
||
|
|
| 지표 | 값 |
|
||
|
|
|------|-----|
|
||
|
|
| 총 리소스 요청 | 71개 |
|
||
|
|
| 전송 크기 | 2,535 KB |
|
||
|
|
| Script 요청 | 44개 |
|
||
|
|
| Fetch 요청 | 20개 |
|
||
|
|
| Link (CSS) | 4개 |
|
||
|
|
| Image | 1개 |
|
||
|
|
|
||
|
|
### 메모리 사용량
|
||
|
|
| 지표 | 값 | 등급 |
|
||
|
|
|------|-----|------|
|
||
|
|
| Used JS Heap | 11 MB | 🟢 Good |
|
||
|
|
| Total JS Heap | 12 MB | - |
|
||
|
|
| Usage Percent | < 1% | 🟢 Excellent |
|
||
|
|
|
||
|
|
### DOM 메트릭
|
||
|
|
| 지표 | 값 | 등급 |
|
||
|
|
|------|-----|------|
|
||
|
|
| DOM 노드 수 | 1,107개 | 🟢 Good |
|
||
|
|
| Body Size | 134 KB | - |
|
||
|
|
|
||
|
|
---
|
||
|
|
|
||
|
|
## ⚡ 자유게시판 성능 메트릭
|
||
|
|
|
||
|
|
### 페이지 상태
|
||
|
|
| 지표 | 값 |
|
||
|
|
|------|-----|
|
||
|
|
| URL | /boards/free |
|
||
|
|
| 리소스 요청 | 83개 |
|
||
|
|
| DOM 노드 수 | 437개 |
|
||
|
|
| 메모리 사용 | 12 MB |
|
||
|
|
|
||
|
|
---
|
||
|
|
|
||
|
|
## 📈 성능 등급 기준
|
||
|
|
|
||
|
|
### 페이지 로드
|
||
|
|
| 등급 | 시간 범위 |
|
||
|
|
|------|----------|
|
||
|
|
| 🟢 Excellent | < 500ms |
|
||
|
|
| 🟢 Good | 500ms ~ 1초 |
|
||
|
|
| 🟡 Acceptable | 1초 ~ 2초 |
|
||
|
|
| 🟠 Slow | 2초 ~ 3초 |
|
||
|
|
| 🔴 Critical | > 3초 |
|
||
|
|
|
||
|
|
### API 응답
|
||
|
|
| 등급 | 시간 범위 |
|
||
|
|
|------|----------|
|
||
|
|
| 🟢 Fast | < 200ms |
|
||
|
|
| 🟢 Good | 200ms ~ 500ms |
|
||
|
|
| 🟡 Acceptable | 500ms ~ 1초 |
|
||
|
|
| 🟠 Slow | 1초 ~ 2초 |
|
||
|
|
| 🔴 Critical | > 2초 |
|
||
|
|
|
||
|
|
---
|
||
|
|
|
||
|
|
## ✅ 검증 완료 항목
|
||
|
|
|
||
|
|
- [x] Performance API 접근 가능
|
||
|
|
- [x] Navigation Timing 수집
|
||
|
|
- [x] Paint Timing 수집
|
||
|
|
- [x] Resource Timing 수집
|
||
|
|
- [x] Memory API 접근 (Chrome)
|
||
|
|
- [x] DOM 노드 카운트
|
||
|
|
- [x] 성능 등급 판정 로직
|
||
|
|
|
||
|
|
---
|
||
|
|
|
||
|
|
## 🔧 수집 스크립트
|
||
|
|
|
||
|
|
### 초기화
|
||
|
|
```javascript
|
||
|
|
window.__PERF_METRICS__ = {
|
||
|
|
startTime: Date.now(),
|
||
|
|
pageLoads: [],
|
||
|
|
apiCalls: []
|
||
|
|
};
|
||
|
|
```
|
||
|
|
|
||
|
|
### 측정
|
||
|
|
```javascript
|
||
|
|
const nav = performance.getEntriesByType('navigation')[0];
|
||
|
|
const metrics = {
|
||
|
|
domContentLoaded: nav.domContentLoadedEventEnd - nav.startTime,
|
||
|
|
load: nav.loadEventEnd - nav.startTime,
|
||
|
|
ttfb: nav.responseStart - nav.requestStart
|
||
|
|
};
|
||
|
|
```
|
||
|
|
|
||
|
|
---
|
||
|
|
|
||
|
|
## 📁 관련 파일
|
||
|
|
|
||
|
|
- 성능 전역 설정: `e2e/scenarios/_global-performance-config.json`
|
||
|
|
- E2E 설정 문서: `.claude/E2E_TEST_CONFIG.md`
|