Ajax란?
Asyncrhronous JavaScript And Xml(비동기식 자바스크립트와 XML)의 약자로, 빠르게 동작하는 동적인 웹 페이지를 만들기 위한 개발 방식의 하나이다.
먼저 브라우저와 서버의 통신 방식을 살펴보면, 서버는 요청받은 페이지(HTML)를 반환하고, 이때 HTML에서 로드하는 CSS, JavaScript도 함께 반환된다. 클라이언트(브라우저) 요청에 따라 서버는 정적인 파일을 반환할 수도 있고 서버 사이드 프로그램이 만들어낸 파일이나 데이터를 반환할 수도 있다. 서버로부터 웹페이지가 반환되면 클라이언트는 이를 렌더링하여 화면에 표시하는 것이다.
Ajax는 자바스크립트를 이용해 비동기적으로 서버와 브라우저가 데이터를 교환하여 통신할 수 있도록 해준다. 쉽게 말해, 기존의 웹 페이지는 하이퍼링크를 바탕으로 전체 페이지를 다시 갱신하는 방식으로 동작했지만, Ajax를 통해 백그라운드 영역에서 서버와 통신을 하여 웹페이지의 일부만 갱신할 수 있다.
이때 서버와는 JSON / XML / HTML / 텍스트 파일 등 다양한 형태의 데이터를 주고 받을 수 있고, Ajax 명칭에는 그 당시 대표적인 데이터 타입인 XML이 쓰인 것이고 요즘은 JSON을 일반적으로 사용한다.
Ajax의 장단점
장점
- 웹 페이지의 속도 향상
- 서버의 처리가 완료될 때까지 기다리지 않고 처리가 가능하다.
- 서버에서 데이터만 전송하면 되므로 전체적인 코드의 양이 줄어든다.
- 기존 웹에서는 불가능했던 다양한 UI를 가능하게 해준다.
단점
- 히스토리 관리가 되지 않는다.
- 페이지 이동 없는 통신으로 보안상의 문제가 있다.
- 연속으로 데이터 요청 시, 서버 부하가 증가할 수 있다.
- XMLHttpRequest를 통해 통신하는 경우, 사용자에게 아무런 진행 정보가 주어지지 않는다.
- Ajax를 쓸 수 없는 브라우저의 문제 이슈가 있다.
- Http 클라이언트의 기능이 한정되어 있다.
- 동일-출처 정책으로 인해 다른 도메인과 통신이 불가능한 Cross-domain 문제가 있다.
'Today I Learned' 카테고리의 다른 글
| Presentationl & Container 디자인 패턴 (0) | 2023.11.04 |
|---|---|
| 웹 페이지 렌더링 방식 - CSR / SSR / SSG (0) | 2023.10.30 |
| HTTP 요청 메소드 (0) | 2023.10.05 |
| 브라우저의 동작 원리 (0) | 2023.09.27 |
| [git] git flow - 브랜치 전략 (0) | 2023.09.15 |
