웹 최적화란?

일반적인 최적화(optimization)란?

: 알맞은 상황으로 맞추며, 일반적으로 최대 효과를 얻기 위해 최선의 노력을 하는 행위

 

IT시스템에 최적화가 필요한 이유?

: 하드웨어는 용량설계를 최적화하여 비용 대비 효과를 얻어야하며, 웹 사이트는 검색 엔진 최적화(Search Engine Optimization, SEO)를 실행하면 조금 더 빠르게 얻어야함.

검색엔진이 최적화 된다는건 다른 사이트에 비해  자주 상단에 노출되어 많은 방문자를 이끌어내므로 결국 웹 사이트 홍보 또는 웹 사이트를 통한 수익 창출에 도움이됨. → 최적화를 실행하면 투입 노력에 비해 상당한 효과를 얻을 수 있다.

 

웹 최적화란?

: 최고의 웹 성능을 구현하기 위해 최고의 조건을 만드는 다양한 노력을 의미.

 

웹 최적화의 3가지 방법

1) 프론트엔드 최적화

 - 웹 UI/UX 관련 최적화

 - HTML, JavaScript, CSS, 이미지 파일, 타사 파일 자체나 혹은 이들이 어우러져 콘텐츠를 만들어낼 떄 최적화 진행

 - 프론트엔드 최적화 기술은 웹 브라우저를 실제로 사용하는 사용자 환경에 따라 달라짐. ex) PC, 태블릿, 스마트폰 등 사용자의 기기, 네트워크 속도와 품질 그리고 브라우저 등에 따라 상대적으로 적용.

→ 프론트엔드 최적화가 잘 되어 있으면, 브라우저에서 콘텐츠를 다운로드, 로딩, 렌더링 할때 속도가 빨라지는 효과가 있음.

※ 프론트엔드를 최적화하는 대표적인 기술

 - 스트크립트를 병합(merge)하여 브라우저의 호출 개수를 줄임.

 - 스크립트 크기를 최소화해 바이트(byte) 자체를 줄임

 - 스크립트를 gzip 등으로 압축하여 전달

 - WebP 등으로 브라우저 이미지 형식을 최적화

 - 이미지 손실, 무손실 압축

 - Cache - Control 응답 헤더를 통해 브라우저 캐시를 충실히 사용

 - 도메인 수를 줄여 DNS 조회를 최소화

 - DNS 정보 미리 읽어 오기

 - CSS를 HTML 상단에, 자바스크립트를 HTML의 하단에 위치시키기

 - 페이지 미리 읽어 오기(page prefetching)

 - 타사 스크립트가 웹의 성능을 방해하지 않도록 조정

 

2) 백엔드 최적화

 - 웹 UI를 로직에 맞게 만드는 백엔드 관련 최적화

※ 대표적인 백엔드 : 웹 서버, 웹 애플리케이션 서버, 데이터베이스, 로드 밸런싱, DNS 서버 등 → 이 시스템들을 튜닝해 정상 출력을 만드는것이 백엔드 최적화하는 목표.

※ 백엔드를 최적화하는 대표적인 기술

 - DNS 응답이 빨라지도록 서버 증설

 - DNS 응답을 빠르게 할 수 있도록 DNS 정보를 최대한 캐싱

 - 웹 서버가 있는 데이터  센터의 네트워크 출력(throughput) / 대역폭(bandwidth) 증설

 - 웹 서버, 웹 애플리케이션 서버의 CPU/RAM 증설

 - 프록시 서버를 설정하여 웹 콘텐츠를 캐싱

 - CDN(Content Delivery Network)을 사용해 인터넷상에 콘텐츠 캐싱

 - 데이터베이스 정규화로 디스크 I/O 최적화

 - 데이터베이스 캐싱으로 응답을 빠르게

 - 로드 밸런싱을 통해 가장 성능이 좋은 웹 서버로 요청을 연결

 - 웹 애플리케이션 로직을 가볍고 빠르게 개발

 

→ 백엔드 최적화는 웹 사이트의 빠른 로딩보다 네트워크를 정상적으로 사용하고 콘텐츠를 전달하기 위해 반드시 필요한 요소

 

DNS란?

: DNS(Domain Name System)는 인터넷 전화전호부. 사람은 도메인 이름을 통해 온라인으로 정보에 액세스. 웹 브라우저는 인터넷 프로토콜(IP 주소를 통해 상호작용. DNS는 브라우저가 인터넷 자원을 로드 할 수 있도록 도메인 이름을 IP주소로 변환.

: 인터넷 호스트명을 클라이언트와  서버가 이해 할 수 있는 IP주소로 변환해주는 시스템.

 

CDN이란?

: CDN(Content Delivery Network)는 지리적 제약 없이 전 세계 사용자에게 빠르고 안전하게 콘텐츠를 전송 할 수 있는 콘텐츠 전송 기술을 의미. 서버와 사용자 사이의 물리적인 거리를 줄여 콘텐츠 로딩에 소요되는 시간을 최소화. CDN은 각 지역에 캐시 서버(PoP, Points of Presence)를 분산 배치해, 근접한 사용자의 요청에 원본 서버에 아닌 캐시 서버가 콘텐츠를 전달

 

로드 밸런싱(Load Balancing)이란?

: 부하부산 또는 로드 밸런싱은 컴퓨터 네트워크 기술의 일종으로 중앙처리장ㅈ치 혹은 저장장치와 같은 컴퓨터 자원들에게 작업을 나누는 것을 의미. 서버에 가해지는 부하(=로드)를 분산(=밸런싱) 해주는 장치 또는 기술.

3) 프로토콜 최적화

: 웹 콘텐츠를 전달하는 HTTP/HTTPS 프로토콜 자체의 효과를 극대화하면 웹 서버가 클라이언트에게 콘텐츠를 최대 속도와 최저 지연 시간으로 전달 할 수 있음. 프로토콜 최적화는 웹 콘텐츠를 더 빠르게 요청하고 응답하도록 프로토콜을 업그레이드 하는 과정.

 

TCP / IP 프로토콜

웹에서는 TCP/IP 프로토콜의 일종인 HTTP를 사용해 콘텐츠를 전달. 네트워크 계층 구조를 표준화한 OSI(Open System Interconnection) 7개 계층 모델에서 TCP는 4번째인 전송 계층에 속하고 HTTP는 7번째인 응용 계층에 속함.

전송 계층(Transport Layer) : 네트워크상에서 송신자와 수신자 사이에 데이터 전송을 보장하는 역할

응용 계층(Application Layer) : 사용자가 메일을 보내고 FTP로 파일을 업로드 하는것처럼 실제 네트워크상에서 소프트웨어와 사용자의 상호 연동을 담당

 

TCP네트워크 사용하는 네트워크에 있어 성능지표

대역폭 : 특정 시간동안 얼마나 많은 네트워크를 트래픽을 보낼 수 있는지 시간당 전송량 의미

지연시간 : 클라이언트와 서버간 콘텐츠를 전달하는 물리적인 시간을 말함. 일반적으로 클라이언트와 서버 사이 요청, 전달, 응답까지 걸리는 시간

 

※ Round Trip Time(RTT) : 서버와 클라이언트 두 호스트를 모두 왕복하는데 걸리는 지연시간

 

TCP혼합제어(Congestion Control)

: TCP네트워크의 통신량을 조절하여 TCP 네트워크가 혼잡해지지 않도록 하는 방식을 의미.

TCP혼합붕괴(Congestion Collapse)

: TCP 네트워크의 통신량이 실제 처리량보다 많아서 문제가 발생하는 것. → 인터넷에 연결된 호스트들이 최대한 많은 정보를 전송하려고 많은 네트워크 패킷을 보내기 때문에 발생

 

→ TCP혼합제어 기술은 패킷을 보내는 쪽에서 네트워크에서 수용할 수 있는 양을 파악하고 그만큼의 패킷만 보내는 약속으로 TCP혼잡을 해결.

 

혼합제어의 대표기술

1) 느린시작(Slow Start)

: TCP연결이 시작되면 전송 가능한 버퍼의 양인 혼잡 윈도우(Congestion Window, CWND)의 초깃값을 작게 설정하여 전송.

2) 빠른 재전송(Fast retransmit)

: 먼저 도착해야하는 패킷이 도착하지 않고 다음 패킷이 도착한 경우에도 수신자가 일단 ACK패킷을 보내는 방식.

3) 흐름제어(Flow Control)

: TCP송신자가 데이터를 너무 빠르게 혹은 너무 많이 전송하여 수신자의 버퍼가 오버플로(overflow)되는 현상을 방지하는 기술.

 

※ HTTP 프로토콜

: HTTP는 용어 그대로 텍스트 이상 콘텐츠들을 웹에서 전달하기 위해 만들어진 프로토콜. 웹은 HTTP 프로토콜을 통해 전달되므로 HTTP 성능을 개선하면 웹 성능도 향상됨. 

 

HTTP 최적화 기술

: 웹 환경이 멀티호스트(multi-host) 환경으로 변하면서 HTTP/1.1 버전부터 멀티호스트 기능과 클라이언트와 서버 사이에서 TCP/IP 연결을 재사용하는 기능을 추가한것이 두드러진 업데이트 내용. HTTP/1.1 버전부터 적용된 연결 재사용(persistent connection), 파이프라이닝(pipelining) 기법이 바로 연결 기반의 HTTP 최적화 기술.

 

※ 네비게이션 타이밍 API(Navigation Timing API)

: 웹 사이트의 성능을 측정하는데 사용 할 수 있는 데이터를 제공함. 이전까지는 브라우저의 자바스크립트 기능을 이용해 웹 페이지가 열리는 시간과 로딩이 완료되는 시간 차이를 계산함으로써 웹 로딩 시간을 구할 수 있었음.

---

출처 : 웹 성능 최적화 기법