useState에 대하여 저번 포스트에서 reRendering에 대해서 다뤘었다. https://ww8007-learn.tistory.com/21 왜 내 컴포넌트는 reRendering이 될까? 이번 포스트에서는 React Component의 reRendering에 대해서 다뤄보려고 합니다. 리렌더링은 안 좋은 거다. useCallback이나 useMemo를 사용해서 최적화를 해야 한다 등 여러 가지 말들이 정말 많은 주제이죠. ww8007-learn.tistory.com reRendering에 대한 내용을 작성하면서 디버깅을 진행하던 도중 문득 나는 React에 대해서 제대로 알고 있는 것이 맞을까? 라는 의문이 들어서 공식 문서를 기반으로 hook 들과 동작 원리에 대해서 이해하고 이를 직접 구현해보..

Intersection Observer란? 일단 MDN의 설명을 보면 다음과 같다는 것을 알 수 있습니다. 대상 요소와 상위 요소, 또는 대상 요소와 최상위 문서의 뷰포트가 서로 교차하는 영역이 달라지는 경우 이를 비동기적으로 감지할 수 있는 수단을 제공함 이게 무슨 말 인가요? 쉽게 말해서 Element가 뷰포트에 보이는지? 보이지 않는지에 따라서 이를 감지할 수 있는 수단을 제공한다는 것을 의미합니다. 아래와 그림과 같이 현재 뷰포트에 보이는 Element는 3개가 존재하죠. 만약 3째의 Element가 등장할 때 어떤 이벤트를 실행 하고 싶다면 어떻게 할까요? 이럴 때 저희는 Intersection Observer를 사용하면 됩니다. 윈도우 scroll을 지원하는데 이걸 굳이 사용해야 하나요? 스크..