인프런 커뮤니티 질문&답변

안녕하세요, 강의 애청자(?) 입니다.

React Server Component가 도입된 후에 interaction이 필요한 component(Client component)만 JS Bundle에 포함시켜서 Browser로 보냄으로써 JS Bundle의 불필요한 계산(용량)을 줄일 수 있다고 말씀하셨습니다.

그렇다면 여기서 궁금한것이 React Server Component를 설명해주시기 전에 Pre Fetching에서 JS Bundle에는 사실 현재 Page에 필요한 JS Bundle만 전달된다. 이유는 용량이 커지면 hydration이 지연되기 때문. 그 후에 Pre fetching으로 나머지 연결된 모든 Page의 JS Bundle을 불러온다고 설명해주신 개념은 여전히 유지가 되는건가요?

즉, 아래의 순서가 맞는지 궁금합니다.

1. (Brower) 접속요청

2. (Server) JS 실행-Rendering

3. (Server to Browser) Rendering 된 HTML

4. (Browser to User) 화면에 Rendering

5. (Server to Browser) JS Bundle( 단, '현재 Page에 필요한', 'Client component')

6. (Browser) Hydration

7. (Browser to User) Interaction 가능 - TTI

8. (Server to Browser) Pre Fetching/JS Bundle (단, '연결된 모든 Page의', 'Client component')

이 순서가 맞을까요?

아니라면.. Pre fetching 개념이 React Server Component 도입이후 없어진건가요?(이건 아닌거같긴한데 ㅎ)

어떻게 동작하는지 궁금합니다.

항상 잘 듣고있습니다.

감사합니다.