[Spring] 1.웹 애플리케이션 이해

[Spring] 1.웹 애플리케이션 이해

 

1. 웹 - HTTP 기반

[HTTP]

- http기반 통신

- 웹브라우저(클라이언트)에서 url 치면 인터넷을 통해 서버 접근 

- 서버에서는 html 만들어서 클라이언트에 내려줌

- 웹브라우저가 html을 보여줌

* 클라이언트 -> 서버 / 서버 -> 클라이언트 데이터 전송 및 응답 => http 프로토콜 기반으로 동작

 

모든 것이  HTTP (http 메세지에 모든 것을 전송)

- HTML, TEXT

- IMAGE, 음성, 영상, 파일

- JSON, XML (API)

- 거의 모든 형태의 데이터 전송 가능

- 서버 간에 데이터를 주고 받을 때도 대부분 http 사용

 

[웹 서버] (Web Server)

- HTTP 기반으로 동작

- 정적 리소스(파일을 폴더에 두면 서버들이 파일들 서빙해줌) 제공, 기타 부가기능 

- 정적(파일), HTML, CSS, JS, 이미지, 영상

- ex) NGINX, APACHE

 

[웹 애플리케이션 서버] (WAS - Web Application Server)

- HTTP 기반으로 동작

- 웹 서버 기능 포함(정적 리소스 제공 가능)

- 프로그램 코드를 실행해서 애플리케이션 로직 수행

> 동적 : HTML, HTTP API (JSON)
> 서블릿, JSP, 스프링 MVC

- ex) 톰캣(Tomcat) Jetty, Undertow

 

웹서버 VS 웹애플리케이션서버(WAS)

- 웹서버는 정적리소스(파일)    WAS는 애플리케이션 로직 - 사실 둘 용어 경계 모호    웹서버도 프로그램 실행 기능 포함    WAS도 웹서버의 기능 제공 - 자바는 서블릿 컨테이너 기능을 제공하면 WAS    * 서블릿 없이 자바코드를 실행하는 서버 프레임워크도 있음 - WAS는 애플리케이션 코드를 실행하는데 더 특화

 

[웹 시스템 구성] - WAS, DB

- WAS, DB만으로 시스템 구성 가능

- WAS는 정적 리소스, 애플리케이션 로직 모두 제공 가능

 

BUT

- WAS가 너무 많은 역할을 담당, 서버 과부하 우려

- 가장 비싼 애플리케이션 로직이 정적 리소스 때문에 수행이 어려울 수 있음

- WAS 장애시 오류 화면도 노출 불가능

 

[웹 시스템 구성] - WEB, WAS, DB

- 정적 리소스는 웹서버가 처리

- 웹서버는 애플리케이션 로직같은 동적인 처리가 필요하면 WAS에 요청을 위임

- WAS는 중요한 애플리케이션 로직 처리 전담

 

- 효율적인 리소스 관리

> 정적 리소스가 많이 사용되면 Web 서버 증설
> 애플리케이션 리소스가 많이 사용되면 WAS 증설

- 정적 리소스만 제공하는 웹서버는 잘 죽지 않음

- 애플리케이션 로직이 동작하는 WAS 서버는 잘 죽음

- WAS, DB 장애시 WEB서버가 오류 화면 제공 가능

---

2. 서블릿

HTML Form 데이터 전송

- POST 전송 (저장)

- form 태그에 값 입력 후 전송 누르면 웹브라우저가 HTTP 메시지 생성

- 컨텐트 바디에는 쿼리가 만들어지고 해당 인코딩 방식으로 보내짐

 

서버에서 처리해야하는 업무

- 웹 애플리케이션 서버 직접 구현 -> 서블릿

- 의미있는 비즈니스 로직 부분만 할 수 있도록 서블릿 제공

 

[서블릿]

특징

- urlPatterns(/hello)의 URL이 호출되면 서블릿 코드가 실행

- HTTP 요청 정보를 편리하게 사용할 수 있는 HttpServletRequest

- HTTP 응답 정보를 편리하게 제공할 수 있는 HttpServletResponse

- 개발자는 HTTP 스펙을 매우 편리하게 사용

 

HTTP 요청/응답 흐름

- HTTP 요청시

> WAS는 Request, Resoponse 객체를 새로 만들어서 서블릿 객체 호출
> 개발자는 Request 객체에서 HTTP 요청 정보를 편리하게 꺼내서 사용
> 개발자는 Response 객체에 HTTP 응답 정보를 편리하게 입력
> WAS는 Response 객체에 담겨있는 내용으로 HTTP 응답 정보를 생성

- 서블릿 객체를 서블릿 컨테이너가 자동으로 생성 / 호출 / 관리->종료(생명주기)

 

[서블릿 컨테이너]

- 톰캣처럼 서블릿을 지원하는 WAS를 서블릿 컨테이너라고 함

- 서블릿 컨테이너는 서블릿 객체를 생성/초기화/호출/종료하는 생명주기 관리

- 서블릿 객체는 싱글톤으로 관리 (객체를 하나만 생성하고 공유, JVM에는 객체 하나만 생성)

> 고객의 요청이 올 때마다 계속 객체를 생성하는 것은 비효율
> 최초 로딩 시점에서 서블릿 객체를 미리 만들어두고 재활용
> 모든 고객 http 요청은 동일한 서블릿 객체 인스턴스에 접근
> 공유 변수 사용 주의
> 서블릿 컨테이너 종료시 함께 종료

- JSP도 서블릿으로 변환되어서 사용

- 동시 요청을 위한 멀티 쓰레드 처리 지원

---

3. 동시 요청 - 멀티 쓰레드

1) 요청/응답

2) 커넥션 연결

서블릿 객체를 누가 호출하는가?

[쓰레드]

- 애플리케이션 코드를 하나하나 순차적으로 실행하는 것

- 자바 메인 메서드를 처음 실행하면 main이라는 이름의 쓰레드 실행

- 쓰레드가 없다면 자바 어플리케이션 실행이 불가능

- 쓰레드는 한번에 하나의 코드 라인만 수행

- 동시 처리가 필요하면 쓰레드를 추가로 생성

 

<< 단일 요청 >>  - 쓰레드 하나 사용

1) 단일 쓰레드

2) 요청

- 요청이 오면 쓰레드 할당

- 해당 쓰레드를 가지고 서블릿 객체 호출

 

3) 응답

- 응답 되고나서 쓰레드 휴식

 

<< 다중 요청 >>  - 쓰레드 하나 사용

1) 요청1

- 쓰레드 써서 서블릿 호출

- but 서블릿 호출 지연

 

2) 요청2

- 쓰레드가 하나이기 때문에 요청2 대기

 

3) 둘 다 죽음

 

해결

- 요청마다 쓰레드 생성

- 요청이 올때마다 쓰레드 생성하고, 요청이 끝나면 쓰레드 날리기

 

요청마다 쓰레드 생성할시 장단점

장점)

- 동시 요청을 처리할 수 있음

- 리소스(CPU, 메모리)가 허용할 때까지 처리기능

- 하나의 쓰레드가 지연되어도, 나머지 쓰레드는 정상 동작

 

단점)

- 쓰레드는 생성 비용이 비쌈

   고객의 요청이 올때마다 쓰레드를 생성하면 응답속도가 늦어짐

- 쓰레드는 컨텍스트 스위칭 비용 발생 (CPU 코어에서)

- 쓰레드 생성에 제한 없음

   고객 요청이 너무 많이 오면 CPU, 메모리 임계점을 넘어 서버가 죽을 수 있음 (치킨 할인 / 수강신청 등)

 

[쓰레드 풀]

 

1) 

- 미리 만들어든 쓰레드 풀

- 요청이 올때마다 쓰레드 풀에서 쓰레드 꺼내씀

- 다 쓰면 쓰레드풀에 반납

 

2) 200개 동시 요청

- 쓰레드 풀에 쓰레드가 없으면 대기/거절 가능

- 대기도 요청 개수 제한 가능

 

쓰레드 풀 정리

특징)

- 필요한 쓰레드를 쓰레드 풀에 보관하고 관리

- 쓰레드 풀에 생성 가능한 쓰레드의 최대치를 관리 (톰캣은 최대 200개 기본 설정 - 변경 가능)

검색) spring boot tomcat max connection

 

사용)

- 쓰레드가 필요하면, 이미 생성되어있는 쓰레드를 쓰레드 풀에서 꺼내 사용

- 사용을 종료하면 쓰레드 풀에 해당 쓰레드 반납

- 최대 쓰레드가 모두 사용중이어서 풀에 쓰레드가 없다면 ?

  기다리는 요청 거절/특정숫자만큼 대기 설정 가능

 

장점)

- 쓰레드가 미리 생성되어 있으므로, 쓰레드를 생성하고 종료하는 비용(CPU) 절감 및 응답 시간 빠름

- 생성 가능한 쓰레드의 최대치가 있으므로 너무 많은 요청이 들어와도 기존 요청 안전하게 처리 가능

* 너무 많으면 서버 증설 해야함

 

쓰레드 풀 - 실무 팁

- WAS의 주요 튜닝 포인트는 최대 쓰레드(max thread)이다

- 이 값을 너무 낮게 설정하면? -> 동시 요청이 많으면 서버 리소스는 여유롭지만, 클라이언트는 금방 응답 지연

- 이 값을 너무 높게 설정하면? -> 동시 요청이 많으면 CPU, 메모리 리소스 임계점 초과로 서버 다운

- 장애 발생시? -> 클라우드면 일단 서버 늘리고 이후 튜닝 / 클라우드가 아니면 열심히 튜닝

 

적정 숫자 어떻게 찾는가?

- 애플리케이션 로직의 복잡도, CPU, 메모리, IO 리소스 상황에 따라 모두 다름

- 성능 테스트 

  > 최대한 실제 서비스와 유사하게 성능 테스트 시도

  > 툴 : 아파치 ab, 제이미터, nGrinder

 

[핵심]

WAS의 멀티 쓰레드 지원!!!

- 멀티 쓰레드에 대한 부분은 WAS가 처리

- 개발자가 멀티 쓰레드 관련 코드를 신경쓰지 않아도 됨

- 개발자는 마치 싱글 쓰레드 프로그래밍 하듯 편리하게 소스코드 개발

- 멀티 쓰레드 환경이므로 싱글톤 객체(서블릿, 스프링 빈) 주의해서 사용

 

---

4. HTML, HTTP API, CSR, SSR

[정적 리소스]

- 고정된 HTML 파일, CSS, JS, 이미지, 영상 등을 제공

- 웹서버에서 생성된 파일을 제공

- 주로 웹 브라우저에서 요청을 받아서 처리

 

[HTML 페이지]

그림 설명) 주문내역 보여달라는 요청 -> WAS(애플리케이션 로직 수행)가 DB통해 주문 정보 조회 -> 동적으로 HTML 생성(JSP, 타임리프) -> 웹브라우저에 HTML 반환

 

- 동적으로 필요한 HTML 파일을 생성해서 전달

- 웹 브라우저 : HTML 해석

 

[HTTP API]

- HTML이 아니라 JSON데이터를 웹브라우저를 전달

- 주로 JSON 형식 사용

- HTML이 아니라 다양한 시스템에서 호출

ex)

- 데이터만 주고받음

-  UI 화면이 필요하면 클라이언트가 별도로 처리

(1) UI 클라이언트 접점

- 앱 클라이언트 (아이폰, 안드로이드, PC앱)

- 웹브라우저에서 자바스크립트를 통한 HTTP API 호출)

- React, Vue.js 같은 웹 클라이언트

(2) 서버 to 서버

- 주문 서버 -> 결제 서버

- 기업간 데이터 통신

 

서버 사이드 렌더링 (SSR) - 서버에서 최종 HTML을 생성해서 클라이언트에 전달

- HTML 최종 결과를 서버에서 만들어서 웹 브라우저에 전달

- 주로 정적인 화면에 사용

- 관련기술 : JSP, 타임리프 (백엔드 개발자)

 

클라이언트 사이드 렌더링 (CSR)

- HTML 결과를 자바스크립트를 사용해 웹 브라우저에서 동적으로 생성해서 적용

- 주로 동적인 화면에 사용, 웹 환경을 마치 앱처럼 필요한 부분부분 변경 가능

- ex) 구글 지도, Gmail, 구글 캘린더

- 관련 기술 : React, Vue.js  (프론트엔트 개발자)

 

참고

- React, Vue.js를 CSR + SSR 동시에 지원하는 웹 프레임워크도 있음

- SSR을 사용하더라도, 자바스크립트를 사용해서 화면 일부를 동적으로 변경 가능

 

어디까지 알아야하나? - 백엔드 개발자 입장에서 UI 기술

[백엔드] - 서버 사이드 렌더링 기술 (SSR) - JSP, 타임리프 - 화면이 정적이고, 복잡하지 않을 때 사용 - 백엔드 개발자는 서버 사이드 렌더링 기술 학습 필수 [웹 프론트엔드] - 클라이언트 사이드 렌더링 기술 (CSR) - React, Vue.js - 복잡하고 동적인 UI 사용 - 웹 프론트엔드 개발자의 전문 분야

 

<선택과 집중>

- 백엔드 개발자의 웹 프론트엔드 기술 학습은 옵션

- 백엔드 개발자는 서버 / DB / 인프라 등 수많은 백엔드 기술을 공부해야함

- 웹 프론트엔드도 깊이있게 잘하려면 숙련 오랜시간 필요

---

5. 자바 백엔드 웹 기술 역사

[과거기술]

 

[현재 사용 기술]

 

스프링 웹 기술의 분화

- Web Servlet - Spring MVC

- Web Reactive - Spring WebFlux 

 

스프링 웹 플럭스(WebFlux) - 가장 최신

특징)

- 비동기 넌 블러킹 처리

- 최소 쓰레드로 최대 성능 - 쓰레드 컨텍스트 스위칭 비용 효율화

- 함수형 스타일로 개발 - 동시처리 코드 효율화

- 서블릿 기술 사용 X

그런데)

- 웹플럭스는 기술적 난이도 높음

- 아직은 RDB 지원 부족

- 일반 MVC의 쓰레드 모델도 충분히 빠름

- 실무에서 아직 많이 사용하지 않음 (1% 이하)

 

자바 뷰 템플릿 역사