AI 요약관련 정보

• 과거 웹은 모든 상호작용마다 페이지 전체를 새로고침하여 사용자 경험이 비효율적이었음. 🔄
• AJAX 개념은 페이지 전체 새로고침 없이 필요한 데이터만 비동기적으로 가져와 웹페이지 일부를 동적으로 변경하는 방식임. 💡
• XMLHttpRequest(XHR)는 최초의 브라우저 내장 HTTP API로 웹 앱 발전에 기여했으나, 콜백 기반으로 가독성이 낮고 콜백 헬 문제가 있었음. 🕸️
• Fetch API는 ES6 이후 도입된 Promise 기반의 브라우저 내장 API로, 비동기 처리가 용이하고 코드가 간결하며 현대 웹에 적합하게 설계됨. ✨
• Fetch의 Response Body는 ReadableStream 형태로, 데이터를 청크 단위로 점진적으로 읽어 메모리 효율성과 빠른 처리에 이점을 제공함. 🌊
• .json() 메서드는 ReadableStream을 읽고 JSON.parse()를 내장적으로 호출하여 JS 객체로 변환하며, 데이터 송수신 시 JSON.stringify()와 JSON.parse() 변환이 필요함. ↔️
• Axios는 Fetch보다 다양한 기능(요청 취소, 타임아웃, 인터셉터)을 제공하는 서드파티 라이브러리로, JSON 자동 파싱 및 HTTP 에러 자동 처리가 강점임. 🚀
• Axios의 인터셉터는 HTTP 요청 및 응답을 중간에서 수정하거나 검사하여 공통 로직 처리에 매우 유용함. 🛡️
• Ky는 Fetch를 편리하게 사용하기 위한 작은 래퍼 라이브러리로, Axios와 유사한 기능(JSON 자동 파싱, 인터셉터, 에러 자동 throw)을 제공하면서 번들 크기가 작음. 🤏
• HTTP 클라이언트 선택 시, Fetch는 번들 크기 민감 및 직접 제어 필요 시, Axios는 복잡한 기능 및 확장성 필요 시, Ky는 간결한 코드와 작은 번들 크기를 원할 때 적합함. ⚖️