• 카테고리

    질문 & 답변
  • 세부 분야

    풀스택

  • 해결 여부

    미해결

리액트 리랜더링의 과정에 관한 질문

21.12.30 12:07 작성 조회수 176

0

안녕하세요, 강의 잘 듣고 있습니다.

리액트 노드버드 sns 강좌 중 "리랜더링 이해하기" 편을 보면서 애매하게 이해하고 있는 부분이 있어 확실하게 하고자 질문을 남깁니다. 크게 두가지 질문인데요,

 

1. 

이 사진은 강의 중 로그인 컴포넌트를 만드는 코드입니다.

class명이 'number2'인 태그에 loading이라는 prop을 전달하고 있습니다. 나중에 로그인 정보를 입력하고 이 로그인 버튼을 눌렀을때 axios와 같은 방법으로 서버에 요청을 하고 그 결과값을 받는 동안 loading props를 true로 바꾸는 식으로 진행이 되겠죠?

제가 궁금한거는 이때 prop이 바뀌는 부분은 'number2' 이 부분이니까  정확이 이 부분만 리랜더링이 되는건가요? 아니면 이것을 감싸고 있는 ButtoWrapper(class명 'number1') 이 부분 전체가 리랜더링이 되는걸까요?

 

2.

 

리액트 툴을 통해서 리랜더링 되는 부분을 이렇게 색깔로 확인할 수가 있는데, 여기서 색깔로 표시되는 부분은 정확하게 리랜더링이 되고 있다는 의미일까요? 아니면 이 중에 리랜더링이 안되고 있는데 버그처럼 계속 반짝이고 있는 경우도 있는걸까요?

질문이 허접해서 죄송합니다.. 확실히 알고자 이렇게 질문남깁니다 ㅠ 

 

 

답변 1

답변을 작성해보세요.

0

1. 아예 Form부터 전체가 다 리렌더링됩니다.

2. 네 리렌더링되고 있는 겁니다. 다만 리렌더링 !== 화면다시그리기 입니다. 리렌더링은 컴포넌트가 다시 실행되는 것이고, 그 중에서 진짜 실제로 바뀐게 있으면 화면을 다시 그립니다.