코드스테이츠 프론트엔드 부트캠프 Day 31. [HTTP/네트워크]

API 문서

데이터를 요청하는 방법이 들어있는 문서

 

port

서버로 진입할 수 있는 통로

 

무상태성(Stateless)

HTTP는 이전 요청과 응답에 대해 기억하지 않는다.

 

AJAX

Asynchronous JavaScript And XMLHttpRequest

웹 페이지에 필요한 데이터만 비동기적으로 받아와 화면에 그려낼 수 있다.

 

핵심 기술은 JavaScript, DOM, Fetch

AJAX가 있기에 SPA 구현 가능.

 

SSR VS CSR

 

SSR(Server Side Rendering) => next.js

장점: TTV(Time To View)가 짧다, SEO(Search Engine Optimization)가 좋다.

단점: 사용자와의 상호작용(TTI: Time To Interaction)이 느리다.

 

CSR(Client Side Rendering) => react

장점: 사용자와의 상호작용이 빠르다(TTV === TTI).

단점: JavaScript 파일의 크기에 따라 SSR에 비해 첫 페이지 로딩 시간이 길어질 수 있다.

 

코드 스플리팅(필요한 js 파일만 일단 받는 것)을 통해 TTV를 줄일 수 있다.

 

-Action Item

React.Lazy()

React.Suspense()

알아보기

 

요즘은 next.js와 react를 혼합해서 사용한다.