feat(seo): Phase 3 — preload LCP image and reduce APP_INITIALIZER blocking
CI Pipeline / backend-test (push) Successful in 10m9s
CI Pipeline / frontend-build (push) Successful in 30s
CI Pipeline / backend-lint (push) Successful in 9s
CI Pipeline / frontend-test (push) Successful in 30s
CI Pipeline / backend-test (pull_request) Successful in 10m30s
CI Pipeline / frontend-test (pull_request) Successful in 25s
CI Pipeline / frontend-build (pull_request) Successful in 41s
CI Pipeline / backend-lint (pull_request) Successful in 9s
CI Pipeline / quality-gate (push) Successful in 3s
CI Pipeline / quality-gate (pull_request) Successful in 3s
CI Pipeline / backend-test (push) Successful in 10m9s
CI Pipeline / frontend-build (push) Successful in 30s
CI Pipeline / backend-lint (push) Successful in 9s
CI Pipeline / frontend-test (push) Successful in 30s
CI Pipeline / backend-test (pull_request) Successful in 10m30s
CI Pipeline / frontend-test (pull_request) Successful in 25s
CI Pipeline / frontend-build (pull_request) Successful in 41s
CI Pipeline / backend-lint (pull_request) Successful in 9s
CI Pipeline / quality-gate (push) Successful in 3s
CI Pipeline / quality-gate (pull_request) Successful in 3s
- Add <link rel="preload"> for hero background image (LCP element) in index.html - Remove blocking APP_INITIALIZER for config.json and station config loading - Config loads now fire asynchronously in App.ngOnInit() (browser only) - SSR/prerender renders instantly with default config — no network wait - Improves LCP, Time to First Byte, and initial paint for SEO
This commit is contained in:
1 parent
a8b6e65831
commit
e2356954ef
5 files changed
+39
-32
No files matched your search
@@ -1,5 +1,6 @@
|
||||
import { Component, computed, effect, inject, OnInit, OnDestroy, PLATFORM_ID } from '@angular/core';
|
||||
import { isPlatformBrowser } from '@angular/common';
|
||||
import { HttpClient } from '@angular/common/http';
|
||||
import { RouterOutlet } from '@angular/router';
|
||||
import { NavbarComponent } from './navbar/navbar.component';
|
||||
import { MediaPlayerComponent } from './media-player/media-player.component';
|
||||
@@ -7,6 +8,7 @@ import { FooterComponent } from './footer/footer.component';
|
||||
import { StructuredDataComponent } from './structured-data/structured-data.component';
|
||||
import { StationConfigService } from './services/station-config.service';
|
||||
import { SeoService } from './services/seo.service';
|
||||
import { loadAppConfigAsync } from './services/app-config.service';
|
||||
|
||||
@Component({
|
||||
selector: 'app-root',
|
||||
@@ -19,6 +21,7 @@ export class App implements OnInit, OnDestroy {
|
||||
private stationConfig = inject(StationConfigService);
|
||||
private seoService = inject(SeoService);
|
||||
private platformId = inject(PLATFORM_ID);
|
||||
private http = inject(HttpClient);
|
||||
|
||||
readonly hasStream = computed(() => {
|
||||
const cfg = this.stationConfig.config();
|
||||
@@ -54,6 +57,12 @@ export class App implements OnInit, OnDestroy {
|
||||
// These DOM operations only run in the browser.
|
||||
if (!isPlatformBrowser(this.platformId)) return;
|
||||
|
||||
// Load runtime config.json and station config asynchronously in the
|
||||
// background — do not block rendering. The app already renders with
|
||||
// defaults from the SSR/prerendered HTML.
|
||||
loadAppConfigAsync(this.http).catch(() => {});
|
||||
this.stationConfig.load().catch(() => {});
|
||||
|
||||
// Start watching router for automatic SEO metadata updates per route.
|
||||
this.seoService.watchRouter();
|
||||
// Handle the initial route (NavigationEnd already fired before ngOnInit).
|
||||
|
||||
Reference in new issue
Block a user