📚 Reference

📜 Chapter

Async Component

export & import

Front-end 성능 & 빌드 최적화

‣

‣

성능 최적화 - React

성능 최적화, 빌드 최적화 - Next.js

Vue.js 2.0 버전

• UX를 고려한 데이터 호출 시점

1. 라우터 네비게이션 가드

• 특정 URL로 접근하기 전의 동작을 정의하는 속성 (함수)

2. 컴포넌트 라이프 사이클 훅

• created: (컴포넌트가 생성)되자 마자 호출되는 로직

Vue.js 3.0 버전

렌더링/반응성 비용 줄이기

불필요한 리렌더 줄이기

• 컴포넌트 쪼개기: 자주 변하는 상태를 “작은 컴포넌트”로 격리하면 전체 리렌더가 줄어든다.
• v-memo(Vue 3.2+): 특정 의존성이 바뀌지 않으면 subtree 렌더를 스킵.
  • 예: 리스트 아이템에서 selectedId만 바뀔 때, 나머지는 메모로 고정.