서론 해커뉴스 리액트 프로젝트 진행 도중 기사의 댓글을 보여주는 페이지에서 댓글과 대댓글이 너무 많아 로딩이 오래 걸리고 심지어 버벅거리는 현상이 발생했다. 그래서 1차적으로 댓글만 보여주고 대댓글이 있을 경우 더보기 버튼을 생성해서 사용자가 클릭하면 대댓글을 불러올 수 있도록 수정했다. 댓글과 대댓글이 많은 경우 큰 흐름을 보기에도 괜찮은 방법이었다. 하지만 댓글 자체가 많은 경우에는 여전히 로딩 속도가 느린 문제가 있었다. 레이지 로딩 구현 방법들 그래서 초기 로딩시 모든 댓글을 불러오는게 아니라 뷰포트에 들어온 댓글만 불러오도록 수정하기로 했다. 검색 결과 레이지 로딩을 하는 방법으로는 3가지 정도가 있었는데 다음과 같은 이유로 Intersection Observer를 사용하였다. l

에러 발생시점 > 리액트 프로젝트에서 npm start로 개발 서버 띄운 후 발생 리액트 토이 프로젝트 마무리 단계에서 개발 서버를 띄운 후 개발자 도구를 보는데 에러가 떠있었다. 꽤 길게 써있는 빨간색 글씨에 살짝 쫄았는데 결론적으로는 다행히 쉽게 해결했다. 이 오류가 떴을 때는 하단 문장을 자세히 살펴보자. 나의 경우는 아래 문구에 답이 있었다. React will try to recreate this component tree from scratch using the error boundary you provided, ErrorBoundary. 에러 발생원인 > 리액트 문법 규칙과 오타로 인한 에러 뭔가 문제가 발생해서 리액트 ErrorBoundary를 사용해 컴포넌트 트