버튼을 누를 때마다 매번 Form() 을 호출하는 걸까요?
function Form() 이 html 처럼 고정적으로 표시되고 있는 거라고 생각했는데요.
매번 console.log(counter) 가 호출되는 걸 보니까, 이벤트가 발생할 때마다 Form()도 호출되서 화면에 새로 그려지고 있는 것 같은데 맞는 걸까요?
답변 2
1
맞아요,
이벤트가 발생할때라기보다는,
컴포넌트 내부의 상태가 바뀔때마다 컴포넌트를 새로 그리기 때문에 매번 console.log가 찍히는 것입니다.
UI를 업데이트 하는 방법으로 리액트는 부분만 슬쩍 바꾸는게 아니고 해당 컴포넌트를 매번 re-rendering을 하는 방법을 택한거예요. 아래 블로그 글을 참고해보셔도 좋겠어요.
https://seungddak.tistory.com/109
'33강 setState 더 알아보기' 에서 좀 더 다룹니다 :)
0
이걸 리렌더링이라고 하는군요.
리액트가 virtual DOM을 사용한다고 얼핏 들었는데, virtual DOM을 사용해서 상태가 변한 컴포넌트만 리렌더링해서 전체 렌더링에 비해 응답속도나 성능을 개선하는 건가봐요.
주신 링크 잘 읽어 보겠습니다. 감사합니다 :)
API 적용 안되는 코드 수정 방법입니다.
0
70
1
고양이 이미지가 엑박이 뜨네요
0
50
1
npx 명령어 사용 불가
1
74
1
const 변수와 컴포넌트의 차이
0
88
1
강의노트
0
139
1
vite로 리액트 빌드한 후 깃허브에 배포하는 방법
0
323
1
빌드할때 dist 폴더가 만들어지는데요,
0
764
1
js파일 업로드 요청
0
135
1
변경된 api 사용시 text 안나오는 문제
0
141
1
메인글자수정...
1
266
3
디렉터리 구조 관련하여 참고할 만한 예시가 있을까요?
1
310
1
https://cataas.com/undefined 로 나오는데 왜그런건가요?
1
590
4
고양이 사진이 깨져요.ㅜㅜ
2
358
3
강의 노트 위치를 모르겠습니다
1
342
1
깃 강의노트 어디서 볼 수 있나요?
1
380
2
이해가 안되는 부분이 있어요
1
360
1
api가 안불러와지네요...
1
658
4
진유림 선생님 너무 궁금해서 질문드립니다 ㅜ
1
329
2
react에서 컴포넌트 만들 때 대문자를 쓰는 이유
2
1154
2
https://cataas.com/ 여기 도메인이 죽어서 이미지가 보이지 않습니다 ㅠ
1
328
2
index.js 내용이 바꼈네용
1
317
2
프로젝트에 사용할 상태와 로직 관리 라이브러리 훅 사용 질문입니다.
1
260
2
html 코드 오류
1
462
2
고양이 이미지 깨져요
1
337
2