Next.js 프리렌더링과 최적화 정리

프리렌더링서버에서 미리 html을 생성하고, 완성된 html 파일을 브라우저에 전달하는 방식이다. 1. 리액트 코드의 프리렌더링기본적으로 클라이언트 사이드 렌더링(CSR)을 사용한다.이것은 자바스크립트 파일 다운 후 브라우저에서 실행되어,html을 동적으로 생성하는 방식이다. 그것을 확인해보려면 개발자 도구의 네트워크 탭을 보면 알 수 있다.거기서 문서를 보면 와 같은 빈 태그만 존재하는데그렇기 때문에 초기 html 문서에는 콘텐츠가 없다. 2. next.js 코드의 프리렌더링서버 사이드 렌더링(SSR)과 정적 사이트 생성(SSG)를 지원한다.이는 브라우저가 자바스크립트를 실행하기 전에 서버에서 미리 html을 생성하는 방식이다. 이것도 개발자 도구의 네트워크 탭 문서를 보면 body 태그 안에 모든 ..