NextJS 14! 달라진점? 업그레이드 방법!

NextJS 의 14버전이 발표됐습니다.

13이 나오고 몇달마다 계속 새로운 업데이트가 되고있으면서 이번에 또 14버전이 나왔습니다.

역시나 프론트엔드 생태계는 정말 빠르게 변화하고 발전하고 있다는게 실감이 됩니다.

 

먼저 새롭게 나온 14버전의 달라진 점을 확인해보겠습니다.

공식문서에 발표된 내용을 살펴보겠습니다.

 

①Turbopack 

- 최대 53% 더 빠른 로컬 서버 시작 

- 빠른 새로고침으로 최대 94% 더 빠른 코드 업데이트

 

②서버 작업(안정)

- 캐싱 및 재검증과 통합

- 간단한 함수 호출 또는 기본적으로 양식에서 자동

 

③부분 사전 렌더링(미리보기)

- 빠른 초기 정적 응답 + 스트리밍 동적 콘텐

 

서비스가 규모가 커지거나 코드의 양이 많아지면 로컬에서 실행하며 개발 할때 가장 스트레스 받는게 속도 였습니다.

이번에 14버전에서는 Turbopack을 통해 더욱 더 빨라진 로컬 서버와 새로고침의 속도로 생산성이 증가될 것 같네요. 제일 좋은 업데이트 같습니다.

 

 

---

NextJS 13 -> 14 로 업그레이드 하기

변경사항 node 의 최소버전 변경 v16.14 -> v18.17

npm i next@latest react@latest react-dom@latest eslint-config-next@latest

yarn add next@latest react@latest react-dom@latest eslint-config-next@latest

pnpm up next react react-dom eslint-config-next --latest

bun add next@latest react@latest react-dom@latest eslint-config-next@latest