Next.js

Next.js 를 이해하려면 SPA(Single Page Application)과 SSR(Server Side Rendering)의 특징들을 살펴봐야한다.

SPA

SPA 는 단일 페이지 어플리케이션으로써 사이트에 접속할 때 하나의 페이지를 불러온다.
페이지를 불러올때 필요한 모든 자바스크립트 파일들을 불러오기때문에 초기 로딩시간이 오래걸리게 된다.

또한 React 는 SEO(검색 엔진 최적화)에 좋지 않다.

SSR

SSR 은 서버 사이드 렌더링으로써 사이트에 접속할 때 렌더링 된 html 을 불러오게 된다.
JS 파일을 불러오기 전까지 반응하지 않지만 빠르게 화면에 로딩이 되기때문에 사용자 입장에서는 로딩속도가 빠르게 보이게 된다.

또한 Next.js 는 SEO(검색 엔진 최적화)에 좋다.

하지만 서버사이드 렌더링은 페이지 이동 시 새로운 페이지를 요청하기 때문에 페이지 이동시에 깜빡임이 존재하고 요청을 하는것이 서버에 부담을 주기 때문에 성능상 좋지 않다는 단점을 가지고 있다.

따라서 Next.js 는 SPA와 SSR의 단점을 해결하기 위해서 리액트에 SSR 기능을 더하여 SPA 와 SSR의 장점을 가질 수 있게 된다.