SSR을 사용하지 않는 next.js 앱의 장점은 뭐가 있나요?

Question

SSR을 사용해 next.js 앱을 만들었는데 서버 컴포넌트쪽 인증을 처리하지 못해 전체 앱을 CSR로 전환하자는 의견이 나왔습니다. SEO도 필요하지 않은 앱이라 SSR을 사용하지 않으면 라우팅을 제외하곤 next.js의 어떤 장점을 살릴 수 있는지 잘 모르겠습니다. SSR을 적용한 컴포넌트를 CSR로 전환할바에 앱을 리액트로 변환하는게 프론트 서버를 신경써야하는 단점도 없어질 것 같고 시간도 비슷할거 같아서요.
추가적으로 only CSR로 next.js 사용하시는 분도 계실까요?

김하림 · Accepted Answer

1. 정적 내보내기(`next export`)를 활용하면 정적인 콘텐츠가 있는 페이지의 경우 첫 페이지 로딩 속도가 빨라진다는 장점이 있습니다.
2. Next.js에서 내부적으로 제공하는 다양한 라이브러리를 사용할 수 있습니다. 대표적으로 App/Page Router가 내장되어 있어서 React Router를 설치할 필요가 없습니다. 또, 다국어 처리를 위한 i18n 이나 next/image 같은 이미지 최적화 라이브러리도 유지보수를 오피셜로 하고 있기 때문에 좀 더 안정적인 서비스 운영이 가능합니다.
3. Next.js 깃허브 examples를 들어가보면 유명한 라이브러리를 연동한 기본적인 연동 예제(ex: zustand, apollo, jest ...)를 제공하기 때문에 다양한 라이브러리와 연동이 쉽습니다.

전체적인 상황을 봐야하겠지만, 굳이 새 프로젝트를 만들어야 하는 상황이 아니라면 CSR로 Next.js를 운영하는 것도 프레임워크의 지원을 받을 수 있는 이점이 있기 때문에 좋은 선택입니다.

정주영 · Answer

App/Page Route가 내장되어있어 빠르게 페이지단위로 대규모 작업을 나눠서 할 수 있다는 장점과 이는 react-route를 대신해 자동으로 폴더별로 라우팅이 됩니다. App/api로 백앤드 API를 만들고 호출하기 쉬워진점(현업에서는 실제로 풀스텍으로 사용하지는 않는거 같습니다), SSR을 사용하지 않는다고 해도 랜더링방식과는 별개로(ssr,isr,csr,ssg) 미리 Nextjs가 전페이지를 돌아보며 프리랜더링 할 수 있는 모든것을 서버에서 랜더링하여 내려주게 되어 빠르게 ui를 사용자에게 제공하는것 직접 구현하지 않아도 코드 스플리팅이 된다는것 등이 있을거 같네요. 추가로 vercel에 배포가 쉬워진것?(CI/CD)