NEXT.JS

0hyo·2021년 12월 27일
0

Next.js?

Zeit에서 만든 React 프레임워크
사용언어 typeScript, javaScript

SSR

Server Side Rendering

SSR장점

화면 깜빡임 없음
렌더링 속도 빠름
SEO적용 유리

파일 시스템 기반의 라우팅 기능 제공

파일기방 랑팅은 간단하게 페이지를 추가할 수 있다.

React 사용시

스크립트로 화면을 그리기 때문에 새로고침시 화면 깜빡거림 존재
먼저 빈 html화면이 로드되고 스크립트가 실제화면을 렌더링한다.

코드 스플릿팅

스크립트 파일을 페이지별로 쪼개서 필요한 파일만 로딩하는 기능
-> 초기 구동 속도를 빠르게 할 수 있다.
Google Chrome팀과 협력하여 최적화를 진행한다.

웹프레임워크 + 브라우저 콜라보레이션

next.js 작동원리

  1. 초기 사용자가 서버에 페이지 접속을 요청 -> SSR방식으로 렌더링 될 HTML을 보낸다.
  2. 브라우저에서 javaScript를 다운로드하고 React를 실행
  3. 사용자, 페이지가 서로 상호자굥하여 다른 페이지로 이동 시 서버가 아닌 CSR방식으로 브라우저에서 처리
profile
행동하는 프론트엔드 개발자 되어가는 중 👊 파이팅!!

0개의 댓글