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

안녕하세요~ swr 관련 내용은 아니고 해당 파트에서 질문에 답변해주시는 분야에서 문득 궁금한 점이 생겨 질문 남깁니다.

SWR 사용하기 (쿠키 공유하기) 파트에서 영상 15분 가량에서 useState와 let 변수를 사용하는 것과의 차이점을 설명하시던 부분에서 후자의 경우는 onChange... 이벤트로 글자 하나 하나 입력할 때 마다 리렌더링 되어 제대로 값을 사용할 수 없다고 말씀해주셨는데,

말씀처럼 'abcde' 라는 단어를 Input창에 입력할 때 총 5번의 렌더링이 일어나는 것으로 이해했습니다. 보통 이와 같이 Input 태그에 이벤트 핸들러를 달아줄 때 글자 하나 하나 입력될 때마다 리렌더링 되는 이슈가 성능적으로 큰 영향을 미치나요?

리액트에서 리렌더링 성능과 관련해서 React.memo / useMemo / useCallback 을 주로 사용해서 개선하는 것으로 알고 있는데, 크게 성능적으로 영향을 미치지 않는다면 굳이 사용하지 않는다고도 들은 것 같습니다.

개인적으로는 위 사례에서처럼 글자 하나 하나 입력 때마다 다시 그려지는 것은 필요 이상으로 리렌더링 된다고 생각이 드는데, 이게 보통 성능적으로 큰 문제가 안 되는 편인지와 만약 성능적으로 문제가 된다라고 판단되면  쓰로틀링 같은 기법을 이벤트 핸들러에 추가로 적용하여 이를 방지하는지 궁금합니다.

항상 좋은 수업 감사합니다.