웹 사이트 성능 개선 방법

HTTP 요청 수 줄이기

콘텐츠는 동일하게 유지하면서도 HTTP 요청 수는 줄일 수 있는 방법을 찾아서 적용한다. 

 

클라이언트가 웹 서버랑 통신할 때 html 파일을 먼저 응답 받아 html 내 css, js, image 파일을 차례로 호출한다. 이런 호출은 브라우저가 html을 모두 해석하여 컨텐츠(css, js, image...)를 전부 받아오기까지 호출을 계속 한다. 

 

• 스크립트 파일 병합 - 기능 단위로 모듈화 하면 HTTP 요청 수를 줄일 수 있겠지만 합친 파일이 너무 큰 경우 로딩 과정이 오히려 길어질 수 있다. 
• 인라인 이미지 - css 안에 해시 정보를 통해 이미지 파일을 삽입하면 html 파일의 바이트는 소폭 증가하지만, 전체 로딩 시간은 단축 될 수 있다.
• css 스프라이트 - 주로 아이콘이나 버튼 등 작은 이미지를 하나의 이미지 파일로 결합하고, 이미지가 위치해야 하는 픽셀 정보를 넣어 사용한다. 

 

 

파일 크기 줄이기

• 스크립트 파일(html, js, css, xml, json...)을 압축하여 전달
• 스크립트 파일을 최소화
• 이미지 파일 압축 (메타 정보 등 불필요한 부분 제거)
• 브라우저에서 선호하는 이미지 포맷을 사용
• 파일을 작가 나누어 전송(ex: Accept -Range : byte)

 

 

CDN(Content Delivery Network)

웹 컨텐츠를 사용자에게 빠르게 전달하기 위해 캐시 서버 혹은 에지 서버라 불리는 대용량 인터넷 캐시 영역에 컨텐츠를 저장하여 사용하는 네트워크 방식이다. 프락시의 일종으로 인터넷 트래픽 성능을 개선해준다. 

[장점]

• 네트워크 지연, 패킷 손실 등을 줄인다.
• RTT(Round Trip Time 왕복 시간)가 줄어 빠르게 콘텐츠를 받을 수 있다.
• 원본 서버의 부하를 줄일 수 있다. 
• 모니터링 시스템을 갖추어 인터넷 전송이 필요한 콘텐츠의 시스템과 안전 관리 비용이 절감된다.