SSR? Next.js??

ChungKyu Kim·2022년 3월 6일
1

TIL

목록 보기
30/52

Next.JS를 사용한다고 했다.

왜?

SEO와 SSR때문에

왜?

오케이..

SSR?

  1. Server Side Rendring의 약자
  2. 사용자가 페이제 접속할 때 보여줄 페이지를 미리 준비해서 보여준다.

-> 사용자 친화적이라고 할 수 있겠다.

장점
1. SEO최적화
2. 렌더링 속도가 빨라 사용자가 첫 페이지 접속을 안정적으로 한다.

->
SEO 최적화

  • SSR은 VIEW를 서버에서 전체 렌더링해서 HTML에 모든 컨텐츠가 저장되어 있다.

  • CSR은 HTML을 빈페이지로 인식. 크롤러가 다운로드 전에 JS를 인식하지 못하기 때문

빠른 렌더링

  • SSR은 첫 페이지를 보여준 후 JS를 다운로드,CSR은 모두 다운 후 페이지를 보여준다.

  • 맞다. 첫 접근시 사용자의 발을 묶어놔야하고, 첫 페이지의 렌더링이 늦어 접근에 시간이 걸린다면 사용자는 페이지를 떠날 것이다.

Next.js를 사용하는 이유는?

Next.js 작동 원리

  1. 초기에 사용자가 Server에 페이지 접속을 요청하면, SSR방식으로 렌더링 될 HTML을 보냄.
  2. 브라우저에서 JavaScript를 다운로드하고 React를 실행함.
  3. 사용자, 페이지가 서로 상호작용하여 다른 페이지로 이동할 땐, Server가 아닌 CSR방식으로 브라우저에서 처리함.

애초에 SEO나 사용자 첫 경험에서 매우 유리한게 SSR인데 그 후에 페이지 전환이 느리다는 단점이 있지만 Next.js는 그 단점을 보완했다고 할 수 있다!

한 줄 정리

사용자 첫 경험, SSR방식에 SEO가 유리하고, 단점이자 페이지 전환 속도도 보완한게 Next.js

profile
프리비엣!

0개의 댓글