SEO & Server-Side Rendering (SSR)

Relevant source files

The following files were used as context for generating this wiki page:

• sunrise-angular/src/app/core/services/seo.service.ts
• sunrise-angular/src/app.routes.server.ts
• implementation_plan.md
• task.md
• sunrise-angular/build-routes.js
• vercel.json

Sunrise Communication employs a multi-layered SEO strategy combined with Angular Server-Side Rendering (SSR) to ensure maximum visibility for both human users and AI search agents. The system generates pre-rendered HTML containing semantic metadata, rich snippets, and machine-readable manifests to facilitate discovery and high-intent lead generation.

The project integrates advanced optimization techniques including Answer Engine Optimization (AEO), Generative Engine Optimization (GEO), and Agent-to-Agent Optimization (AAO). These methods target specific discovery layers, from traditional search engines to modern AI bots like GPTBot and ClaudeBot.

Sources: task.md:1-20, implementation_plan.md:7-15

Core SEO Service Architecture

The SeoService manages the injection of metadata and structured data across the application. It utilizes Angular's Title and Meta services to update tags dynamically based on the active route or specific data entities.

Schema Graph Injection

The service outputs a unified JSON-LD @graph instead of individual script blocks. This consolidated approach improves parsing efficiency for search engines. It injects specific nodes for different page types, including LocalBusiness, Service, Product, FAQPage, HowTo, and BreadcrumbList.

The diagram shows the logic flow where specialized methods generate specific Schema nodes before injecting them into a single script block in the document head.
Sources: sunrise-angular/src/app/core/services/seo.service.ts:13-25, task.md:17-23

Specialized Metadata Methods

The service includes dedicated methods for various content verticals to ensure high-intent discovery:

Method	Purpose	Key Schema Nodes
updateForServiceCluster	Optimizes high-intent service pages.	Service, FAQPage, HowTo
updateForProduct	Handles hardware catalog details.	Product, Brand, Offer
updateForLocalLanding	Supports Geo-localized search (GEO).	LocalBusiness, AdministrativeArea
updateForTechnicalGuide	Optimizes knowledge base articles.	Article, FAQPage
updateForCctvCalculator	Targets utility-based search queries.	WebApplication, HowTo

Sources: sunrise-angular/src/app/core/services/seo.service.ts:60-310

Server-Side Rendering (SSR) & Static Generation

The application uses @angular/ssr and an Express-based server to pre-render content. This ensures that crawlers receive fully populated HTML containing all relevant SEO tags and JSON-LD graphs.

Render Modes

The system distinguishes between standard routes and dynamic entity routes. Static routes are often pre-rendered, while dynamic routes use RenderMode.Server to ensure content is always fresh and indexable.

This sequence illustrates how the SSR server processes a request to provide a complete HTML response to a crawler, including all SEO metadata.
Sources: sunrise-angular/src/app.routes.server.ts:1-15, implementation_plan.md:118-125

Build-Time Route Generation

A custom build-routes.js script generates static HTML files for specific routes during the post-build phase. This facilitates deployment on CDNs that support clean URLs by creating directory-based index files.

const routes = [
  'about',
  'products',
  'services',
  'services/cctv-surveillance-systems',
  // ... other routes
];

routes.forEach(route => {
  const routeDir = path.join(browserDir, route);
  fs.mkdirSync(routeDir, { recursive: true });
  fs.writeFileSync(path.join(routeDir, 'index.html'), htmlContent);
});

Sources: sunrise-angular/build-routes.js:20-50

Agentic & Machine Discovery (AAO / B2A)

The project includes specific files to serve AI agents and LLMs, following emerging standards for machine-to-machine discovery.

• llms.txt: Follows the official standard to provide a concise overview for AI agents.
• llms-full.txt: Provides in-depth technical specifications, SLAs, and inquiry parameters for detailed AI analysis.
• llms.json: A structured, machine-readable OpenAPI manifest.
• robots.txt: Explicitly grants permissions to AI user-agents such as GPTBot, PerplexityBot, and ClaudeBot while pointing them to the /llms.txt file.

Sources: task.md:9-15

Technical Implementation Details

Metadata Management

The updateMeta function in SeoService standardizes how the application interacts with document headers. It handles standard tags, Open Graph (OG) tags for social sharing, and Twitter cards.

private updateMeta(
  title: string,
  description: string,
  keywords: string,
  canonicalUrl?: string,
  ogType: string = 'website',
  ogImage?: string
) {
  this.titleService.setTitle(title);
  this.metaService.updateTag({ name: 'description', content: description });
  this.metaService.updateTag({ name: 'keywords', content: keywords });
  // ... OG and Twitter tag updates
}

Sources: sunrise-angular/src/app/core/services/seo.service.ts:518-542

Deployment Configuration

The vercel.json configuration ensures that the SSR output is correctly served with appropriate headers. It includes cleanUrls for SEO-friendly pathnames and custom headers for security and caching.
Sources: vercel.json:1-40

The combination of SeoService dynamic injection and SSR pre-rendering ensures that every service, product, and technical guide is immediately indexable with high semantic precision, meeting the requirements for both traditional search and AI-driven discovery engines.