perf(routing): lazy-load AdminLayoutComponent shell
Some checks failed
Architecture Governance / architecture (push) Has been cancelled
Some checks failed
Architecture Governance / architecture (push) Has been cancelled
Phase 3 (Performance). Bundle-stats analysis (esbuild metafile) found AdminLayoutComponent statically imported and used as component: in app.routes.ts, the only route in the file not using loadComponent - pulled the whole backoffice shell into the initial bundle even for storefront-only visitors, even though every child route under it was already lazy. Fixed: component: AdminLayoutComponent -> loadComponent(). Verified live at /backoffice/dashboard - admin-layout-component now its own 21.86kB lazy chunk, no console errors, dashboard renders correctly. Initial bundle over-budget shrank from 438.68kB to 417.53kB. Investigated and deliberately left as-is (not bugs, documented/ legitimate): - src/app/i18n/ru.ts (272kB) eagerly bundled - explicit, commented tradeoff in translate.service.ts (ru is platform default language, avoids extra round-trip for majority of users; en/hy already code-split). Changing this trades bundle size for default-language UX regression - a product call, not a cleanup item. - @lucide/angular (182kB) - verified tree-shaking works correctly (1750 icons in the package, ~85 actually imported by name in icon-registry.ts, sideEffects:false). Cost is genuine icon usage, not dead weight. A further win exists (splitting the icon registry into storefront-critical vs admin-only sets so backoffice-only icons don't ride the eager header/footer import chain) but touches every icon consumer across the app - flagging as a scoped follow-up rather than attempting blind in this pass. Remaining bundle-budget warning after this fix: 1.12MB vs 700kB budget. Given ~350kB is unavoidable Angular framework/router/zone.js floor, +272kB deliberate ru.ts, +182kB legitimate icon usage, the 700kB budget itself looks stale/unrealistic for this app's actual floor - flagging for a business decision on raising it rather than chasing further cuts. tsc --noEmit clean, ng build clean (warning only, no errors), live browser-verified.
This commit is contained in:
@@ -5,7 +5,6 @@ import { adminAuthGuard } from './core/admin-auth/admin-auth.guard';
|
||||
import { authRoutes } from './core/auth/auth.routes';
|
||||
import { adminCategoryDirtyGuard } from './features/admin/categories/guards/admin-category-dirty.guard';
|
||||
import { adminProductDirtyGuard } from './features/admin/products/guards/admin-product-dirty.guard';
|
||||
import { AdminLayoutComponent } from './features/admin/shell/admin-layout.component';
|
||||
import { environment } from '../environments/environment';
|
||||
|
||||
// Core routes (same across all brands)
|
||||
@@ -59,7 +58,7 @@ const coreRoutes: Routes = [
|
||||
{
|
||||
path: 'backoffice',
|
||||
canActivate: [adminAuthGuard],
|
||||
component: AdminLayoutComponent,
|
||||
loadComponent: () => import('./features/admin/shell/admin-layout.component').then(m => m.AdminLayoutComponent),
|
||||
children: [
|
||||
{ path: '', redirectTo: 'dashboard', pathMatch: 'full' },
|
||||
{
|
||||
|
||||
Reference in New Issue
Block a user