[졸업 논문] #2. HTTP1.1/2.0 실험 수행

성능 측정 지표

1. 페이지 로드시간
2. 데이터 전송량
3. TTFB
4. Queuing & Stalled

---

http://localhost:9006/html/http1_index.html

 

HTTP 1.1

480p	페이지 로드시간(ms)	데이터 전송량(MB)	TTFB(ms)	Queuing(ms)	Stalled(ms)
1	149	22.5	1.37	0.38	1.00
2	136	22.5	1.25	0.75	0.88
3	89	22.5	0.75	0.38	1.00
4	116	22.5	0.88	0.38	1.25
5	133	22.5	1.25	0.62	1.13
6	97	22.5	0.88	0.75	0.88
7	111	22.5	1.12	0.50	0.88
8	73	22.5	1.25	0.62	1.75
9	68	22.5	1.13	0.38	1.62
10	109	22.5	1.00	0.75	0.75
평균	108.1	22.5	1.088	0.551	1.114

 

720p	페이지 로드시간(ms)	데이터 전송량(MB)	TTFB(ms)	Queuing(ms)	Stalled(ms)
1	138	24.3	6.75	0.50	0.38
2	130	24.3	9.00	0.38	1.50
3	87	24.3	7.50	1.13	1.13
4	129	24.3	9.25	0.50	1.75
5	105	24.3	4.87	0.38	0.88
6	92	24.3	5.25	0.38	1.00
7	101	24.3	5.50	0.50	1.13
8	123	24.3	5.00	0.62	1.13
9	101	24.3	6.00	0.62	1.62
10	95	24.3	5.88	0.50	0.25
평균	110.1	24.3	6.5	0.551	1.077

 

1080p	페이지 로드시간(ms)	데이터 전송량(MB)	TTFB(ms)	Queuing(ms)	Stalled(ms)
1	96	95.5	1.25	0.38	0.25
2	125	95.5	2.37	0.75	0.50
3	82	95.5	1.62	0.38	0.13
4	93	95.5	2.12	0.50	0.25
5	111	95.5	2.37	0.38	0.13
6	141	95.5	2.25	0.38	0.25
7	140	95.5	2.00	0.50	0.25
8	103	95.5	1.37	0.50	0.25
9	124	95.5	1.75	0.38	0.13
10	106	95.5	1.13	0.25	0.25
평균	112.1	95.5	1.823	0.44	0.239

 

 

The DOMContentLoaded event is fired when the document has been completely loaded and parsed, without waiting for stylesheets, images, and subframes to finish loading

The load event can be used to detect a fully-loaded page.

 

---

https://localhost:9007/html/http2_index.html

HTTP 2.0

480p	페이지 로드시간(ms)	데이터 전송량(MB)	TTFB(ms)	Queuing(ms)	Stalled(ms)
1	150	27.2	5.13	0.38	0.13
2	126	27.2	5.25	0.50	0.25
3	138	27.2	5.13	0.63	0.25
4	179	27.2	5.25	0.38	0.13
5	140	27.2	4.87	0.50	0.25
6	141	27.2	6.37	0.50	0.38
7	133	27.2	5.00	0.75	0.25
8	159	27.2	4.50	0.50	0.25
9	146	27.2	4.88	0.62	0.25
10	143	27.2	5.25	0.38	0.25
평균	145.5	27.2	5.163	0.514	0.239

 

720p	페이지 로드시간(ms)	데이터 전송량(MB)	TTFB(ms)	Queuing(ms)	Stalled(ms)
1	173	24.3	21.62	0.50	0.62
2	172	24.3	16.62	0.62	0.38
3	141	24.3	11.88	0.38	0.25
4	137	24.3	8.37	0.75	0.62
5	164	24.3	15.12	0.50	0.62
6	150	24.3	15.38	0.38	0.25
7	132	24.3	10.87	0.63	0.38
8	147	24.3	7.62	0.50	0.38
9	149	24.3	13.25	0.38	0.25
10	153	24.3	13.75	0.50	0.25
평균	151.8	24.3	13.448	0.514	0.4

 

1080p	페이지 로드시간(ms)	데이터 전송량(MB)	TTFB(ms)	Queuing(ms)	Stalled(ms)
1	144	95.6	13.75	1.62	0.62
2	146	95.6	12.00	0.38	0.25
3	144	95.6	16.50	0.63	0.50
4	146	95.6	14.00	1.13	0.50
5	162	95.6	16.50	0.50	0.25
6	151	95.6	15.00	0.37	0.25
7	149	95.6	13.88	0.38	0.25
8	149	95.6	11.62	0.50	0.38
9	131	95.6	13.50	0.38	0.25
10	143	95.6	11.63	0.37	0.25
평균	146.5	95.6	13.838	0.626	0.35

 

---

사진만 모아 정리

HTTP1.1  - (왼) 480p (중) 720p (오)1080p

HTTP2.0 - (왼) 480p (중) 720p (오)1080p

 

표 정리

	480p		720p		1080p
	HTTP1.1	HTTP2.0	HTTP1.1	HTTP2.0	HTTP1.1	HTTP2.0
✲ 페이지 로드시간	108.1	145.5	110.1	151.8	112.1	146.5
✲ 데이터 전송량	22.5	27.2	24.3	24.3	95.9	95.6
✲ TTFB	1.088	5.163	6.5	13.448	1.823	13.838
Queuing	0.551	0.514	0.551	0.514	0.44	0.626
Stalled	1.114	0.239	1.077	0.4	0.239	0.35

 

*데이터 전송량 = 트래픽 : 트래픽이란 서버를 통해 최종 사용자에게 전달된 데이터의 양을 말합니다. (개발자 도구 network 에서, "transferred"에 해당)

---

결론

페이지 로드시간이 HTTP1.1 < HTTP2.0 왜?

: SSL이 적용되면 한 단계가 더 추가 된다고 볼 수 있다. 그렇기 때문에 이게 영향을 미쳐서 HTTP2.0의 페이지 로드시간이 더 느릴 수 밖에 없다. 하지만 보안 기능의 향상의 장점이 있다.  

 

데이터 전송량이 HTTP1.1 <>= HTTP2.0 왜?

: (480p)HTTP2.0 <  HTTP1.1    |    (720p)HTTP2.0 = = HTTP1.1    |    (1080p)HTTP2.0 > HTTP1.1

1080p에서 HTTP2.0가 HTTP1.1 보다 0.3MB 작은 이유는 헤더 압축이 일어난 것으로 보인다.

 

TTFB가  HTTP1.1 << HTTP2.0 왜?

: 각 프로토콜의 커넥션 방식 차이를 잘 보여 주는 영역으로,  HTTP1.1에서는 단일 리소스를 요청한 다음 요청을 하기 전에 해당 리소스가 다운로드 될 때까지 대기한다. 이것은 매우 느리기 때문에 브라우저는 요청을 다중화 하고 한 번에 여러개의 요청을 시작하여 요청 사이의 대역폭을 분할한다. HTTP2.0는 단일 소켓을 열고 모든 요청을 한 다음 사용 가능한 가장 높은 대역폭 에서 모든 리소스가 스트리밍 되기를 기다린다.