[Next.js] SSR로 페이지 로딩 개선하기
라이북러리를 Next.js로 작업하고 있지만 리액트 훅이 필요한 컴포넌트가 많아서 주로 클라이언트 컴포넌트로 작업하고 있다.
하지만 클라이언트 컴포넌트가 갖고 있는 단점이 있는데, 바로 느린 페이지 로딩 속도이다. HTML을 로드하고 리액트 문법을 적용하기 위해 브라우저가 HTML을 분석하는 과정인 Hydration 때문에 느려지는 것이다.
🔴 문제 살펴보기
독서 상세 페이지로 이동하면 로딩하는 동안 빈 데이터가 나타나기 때문에 흐름이 끊기...
yeonsu.hashnode.dev3 min read