WhatISYourName?

최근 React를 활용한 웹사이트를 만드는 데, 급격한 스크롤을 할 시 성능이 급격하게 내려간 현상을 발견할 수 있었다. 마우스 관련 이벤트에 쓰로틀을 걸어도, 디바운스를 활용해도 성능이 개선되지 않았으나, useMemo를 활용하여 성능을 개선시킬 수 있었다. 그 컴포넌트는 무거운 연산을 하는데 컴포넌트가 다시 렌더링될때마다 다시 무거운 연산을 하기 때문이었던걸로 문제가 발생했기 때문이다. useMemo을 활용한 성능 차이를 알아보자. 1. useMemo useMemo는 React에서 공식적으로 제공하는 hook의 일종으로, 컴포넌트에서 이미 계산된 값을 재사용할 시 활용가능한 함수이다. 즉, 만약 어떠한 이벤트 때문에 React가 컴포넌트를 리렌더링해야 하는 경우 useMemo를 활용하여 자원이 많이 ..

한 달 전, React 개발팀은 6개월 전 많은 리액트 사용자들을 설레게 한, 'useEvent'라는 실험적인 hook 개발을 취소하였다. 이후에 설명하겠지만, 'useEvent' 훅은 기존 컴포넌트 재렌더링 관련 문제를 해결할 수 있는, 하나의 은탄이 되리라 많은 기대를 모았었다. 그러나 React 팀은 저번 달 이에 대한 관련 github 논의 글을 closed 하였고, React 팀은 "다른 방식으로 사용 가능하고, 다른 문법으로, 다른 이름으로 재출시될 수 있다."라고 못 박았다. 내 귀에는 "useEvent 훅을 없애갰다."라는 의미로밖에 들리지 않았다. 이게 어떤 사정이 있길 래 취소되었는지, 어떤 방향으로 새로 개발될지는 리액트 개발팀만이 알고 있겠지만, 이는 React Hooks가 가진 단..