Data Fetching

Server Side Data Fetching

클라이언트에서 요청한 데이터를 서버에서 처리하여 CSR의 문제점들을 해결한다.

처리하는 시점에 따라 SSG, SSR 로 나뉘지만, 더 나은 성능을 위해 혼합해서 사용한다.

CSR에 문제점

• html 문서가 비어있기 때문에 SEO에 취약하고 CDN에 캐싱이 안된다.

• 클라이언트(브라우저)에서 앱 실행에 필요한 모든 파일을 받아야 하기에 보안에 취약하다.

• JS(리액트 코드)를 다운받아 해석하고 DOM tree를 만들어 렌더링 하는 과정이 온전히 클라이언트에서 수행되기에 사용자가 화면을 보는 데까지 시간이 걸린다.

SSG(Static Site Generator)

빌드 시점에 데이터 처리(렌더링)을 하므로 정적인 페이지에 사용된다.

빌드 시점에 처리되기 때문에 요청한 사용자를 구분해 다른 데이터를 보여줘야 하는 동적인 페이지에서 사용할 수 없다.

ISR(Incremental Static Regeneration)

SSG + 특정 주기마다 업데이트하여 페이지를 재생성

SSG에 단점을 보완하며 지정한 주기마다 최신 데이터로 업데이트 한다.

항상 최신 데이터인것을 보장하지 못하며 여전히 사용자를 구분하지 못한다

SSR(Server Side Rendering)

사용자가 요청하는 시점에 실행됨

요청 시점에 데이터를 만들기 때문에 항상 최신 데이터인 것을 보장하고 요청한 사용자를 구분할 수 있다.

하지만 요청할 때마다 데이터를 만들기 때문에 캐싱이 안된다는 단점이 있다.