이 저장소는 React 기반 프론트엔드 애플리케이션의 성능 최적화를 시연하기 위해 만들어졌습니다. 다양한 최적화 기법을 적용하여 애플리케이션의 성능을 향상시키는 방법을 각 커밋을 통해 확인해보세요.
- 적용된 기법
- 동적 라우팅을 이용한 코드 분할(Code Splitting with Dynamic Routing)
- 커밋: a789455
package.json
최적화(dependencies
,devDependencies
)- 커밋: ef2950d
- 트리쉐이킹(Use tree shaking by importing only necessary code)
- 커밋: 1df2740
- 웹팩 설정으로 JS 파일 압축하기(Webpack configuration for advanced JS minification)
- 커밋: 7dac277
- 다양한 프리페칭 전략(Implement pre-fetching strategies)
- 커밋: f838d69
- 동적 라우팅을 이용한 코드 분할(Code Splitting with Dynamic Routing)
이 프로젝트는 Create React App으로 부트스트랩되었습니다.
- Node.js (>= 14.x)
- npm (>= 6.x) 또는 yarn (>= 1.x)
프로젝트를 클론하고 필요한 패키지를 설치합니다.
git clone https://github.com/Violet-Bora-Lee/react-code-package-level-optimization.git
cd react-code-package-level-optimization
npm install (또는 yarn install)
npm start (또는 yarn start)
npm run build:analyze (또는 yarn run build:analyze)