지연 로딩 모듈

지연 로딩은 필요한 경우에만 모듈을 로드하여 성능을 향상시킵니다. 이 중요한 Angular 기능을 살펴보겠습니다.

지연 로딩이란 무엇인가요?

지연 로딩은 앱이 시작될 때 모든 모듈을 로드하는 대신 사용자가 특정 경로로 이동할 때 모듈을 비동기적으로 로드하는 방식입니다.

지연 로딩을 사용하는 이유

• 초기 로딩 시간을 줄입니다
• 성능을 향상시킵니다
• 리소스 사용을 최적화합니다

지연 로드 모듈 만들기

Angular CLI로 지연 로드할 기능 모듈을 만드세요:

ng generate module admin --route admin --module app.module

지연 라우트 구성하기

라우팅 모듈에서 지연 로딩을 설정하세요:

{ path: 'admin', loadChildren: () => import('./admin/admin.module').then(m => m.AdminModule) }

지연 로딩 테스트하기

개발자 도구를 사용하여 라우트가 활성화될 때만 모듈이 로드되는지 확인하세요. 새로운 JS 파일이 동적으로 로드되는 것을 볼 수 있습니다.

사전 로딩 전략

Angular에서는 지연 로드 모듈을 미리 로드하여 탐색 속도를 더욱 향상할 수 있습니다. 일반적인 전략은 다음과 같습니다:

• 사전 로딩 안 함(기본값)
• 모든 모듈 사전 로드

지연 로딩 모범 사례

애플리케이션 시작 시 즉시 필요하지 않은 모듈에 지연 로딩을 사용하세요. 예를 들어 관리자 대시보드나 설정 페이지에 사용할 수 있습니다.

요약

Angular 애플리케이션의 성능을 향상하도록 지연 로딩을 구현하는 방법을 성공적으로 학습하셨습니다. 잘하셨습니다!