Leniwe ładowanie modułów

Len we ładowanie poprawia wydajność, ponieważ moduły są ładowane tylko wtedy, gdy są potrzebne. Przyjrzyjmy się tej ważnej funkcji Angulara.

Czym jest leniwe ładowanie?

Leniwe ładowanie polega na asynchronicznym ładowaniu modułów, gdy użytkownik przechodzi do określonej trasy, zamiast ładowania wszystkich modułów podczas uruchamiania aplikacji.

Dlaczego warto używać leniwego ładowania?

• Skraca początkowy czas ładowania
• Poprawia wydajność
• Optymalizuje wykorzystanie zasobów

Tworzenie modułu ładowanego leniwie

Utwórz moduł funkcjonalny do leniwego ładowania za pomocą Angular CLI:

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

Konfigurowanie tras ładowanych leniwie

Skonfiguruj leniwe ładowanie w module routingu:

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

Testowanie leniwego ładowania

Użyj narzędzi deweloperskich, aby potwierdzić, że moduły są ładowane dopiero po aktywowaniu tras. Zobaczysz, że nowe pliki JS są ładowane dynamicznie.

Strategie wstępnego ładowania

Angular umożliwia wstępne ładowanie modułów ładowanych leniwie, aby jeszcze bardziej przyspieszyć nawigację. Typowe strategie to:

• Brak wstępnego ładowania (domyślnie)
• Wstępne ładowanie wszystkich modułów

Dobre praktyki leniwego ładowania

Stosuj leniwe ładowanie w przypadku modułów, które nie są potrzebne od razu po uruchomieniu aplikacji, takich jak panele administracyjne czy strony ustawień.

Podsumowanie

Pomyślnie nauczono się implementować leniwe ładowanie w celu zwiększenia wydajności aplikacji Angular. Świetna praca!