ArchitecturePerformance
App Router 핵심 장점 — 최적화가 구조적 기본값인 이유
Code Splitting·Prefetch·RSC·Streaming이 직접 구현 없이 내장되어 있다
포스트
RoutingRenderingLayout
App Router Layout 중첩 — RootLayout·Segment·Page의 역할 분담
페이지 이동 시 Layout은 유지되고 Page만 교체되는 구조적 이유
RenderingArchitectureRouting
Page Router vs App Router — React를 어디서 실행할 것인가
브라우저 중심 모델에서 서버 중심 모델로 넘어간 렌더링 패러다임 전환
ArchitectureConfig / Build
클라이언트 번들 오염 — 실행이 아니라 import 그래프가 원인
같은 파일에 서버 코드가 있으면 쓰지 않아도 끌려온다 — client/server 파일 분리
RenderingPerformanceNext.jsDeployment
CDN과 Next.js 캐싱 — SSG가 빠른 것은 빌드 때문만은 아니다
빌드된 HTML이 엣지 서버에 올라가 원본 서버를 아예 거치지 않기 때문이다
RenderingPerformance
getStaticProps vs getServerSideProps — CDN 캐싱과 Prefetch의 차이
빌드 타임이냐 요청마다냐를 넘어, 서버 비용과 체감 속도까지 갈라진다
RenderingArchitecture
렌더링 전략 5가지 — 어디서 HTML을 만드느냐의 차이
CSR·SSR·SSG·ISR·RSC를 페이지별로 섞어 성능과 SEO를 함께 잡는 기준
Component DesignArchitecture
컴포넌트 3단 구조 — Controller는 데이터, List는 가공, Item은 렌더
Item이 store에 직접 접근하는 순간 재사용과 테스트가 어려워진다