CSR2 CSR과 SSR에 대해 알아보자 CSR(Client Side Rendering) 초기 로딩 속도 느림 이후 구동 속도 빠름 뼈대만 있는 HTML만 넘겨주는 역할만 하면 돼서 서버 측 부하가 적음 사용자 경험 우수 : 클라이언트 측에서 연산, 라우팅 등 직접 처리하기 때문에 반응 속도가 빠름 웹 크롤러가 HTML을 읽을 때 텅텅 빈 사이트가 크롤링 되기 때문에 SEO(검색엔진 최적화)에 안 좋음 TTV와 TTI사이 간극이 없음 CSR의 단점 보완 방법? 초기 로딩 속도 느림 → 해결 방법? Code Splitting, tree-shaking, chunk 분리 SEO 불리 → 해결 방법? pre-rendering SSR(Server Side Rendering) JS를 다운로드하고 실행하기 전에 사용자가 화면을 볼 수 있기 때문에 CSR보다.. 2024. 4. 18. Next.js의 App Router와 Pages Router ※ 해당 글은 Next.js 13.4.0 이후 버전 기준 App Router와 Page Router의 차이를 비교한 글입니다. Routing nextjs는 파일 시스템을 기반으로 라우팅을 구현한다. Built-on App Router 서버 중심 라우팅 Next.js 13.4.0 버전의 App Router는 서버 중심 라우팅 방식으로, React Server Components를 사용하여 구현되었다. 가장 큰 변화로는, 서버에서 데이터를 조금 더 쉽게 가져오게 되며, 페이지 이동 시에도 페이지를 재렌더링하지 않고 SPA(Single Page Application)처럼 URL만 업데이트하여 변경된 부분만 렌더링 하는 방식을 제공한다. React Server Components를 기반으로 한 서버 중심 라우팅.. 2024. 3. 20. 이전 1 다음
