<aside> <img src="/icons/list-indent_lightgray.svg" alt="/icons/list-indent_lightgray.svg" width="40px" />

Table Of Content

</aside>

HTTP

HTTP(HyperText Transfer Protocol)란? HTTP는 전송 계층 위에 있는 애플리케이션 계층 프로토콜로, 웹 서비스 통신에 사용된다.

HTTP/1.0

특징

• 한 연결당 하나의 요청을 처리하도록 설계
• 매 요청마다 새로운 TCP 연결이 필요

⚠️ 문제점 : RTT 증가

RTT(Round Trip Time) : 패킷이 목적지에 도달하고 다시 출발지로 돌아오기까지 걸리는 시간 (패킷 왕복 시간)

서버로부터 파일을 가져올 때마다 TCP 3-way handshake를 반복해야 하므로 RTT가 증가하여 다음과 같은 문제가 발생한다.

• 서버 부담 증가
• 사용자 응답 시간 증가

RTT 증가 해결 방법

1. 이미지 스플리팅

   여러 이미지를 하나의 이미지로 합쳐서 다운로드하고, CSS의 background-position으로 필요한 부분만 표시

   #icons > li > a {
   	background-image: url("icons.png");
   	width: 25px;
   	display: inline-block;
   	height: 25px;
   	repeat: no-repeat;
   }
   
   #icons > li:nth-child(1) > a {
   	background-position: 2px -8px;
   }
   
   #icons > li:nth-child(2) > a {
   	background-position: -29px -8px;
   }
   

2. 코드 압축

   개행 문자, 빈칸을 제거하여 코드 크기를 최소화

3. 이미지 Base64 인코딩

   • 이미지를 64진법 문자열로 반환
   • HTTP 요청없이 이미지 사용 가능
   • 단점 : 파일 크기가 약 37% 증가

HTTP/1.1