angular-ssr

This skill enables server-side rendering (SSR), hydration, and prerendering in Angular v20+ applications using the @angular/ssr package. It solves common challenges in single-page applications such as slow initial load times, poor SEO indexing, and reduced performance on low-powered devices. By rendering Angular applications on the server before sending them to the browser, it ensures that users and search engines receive fully formed HTML on first load rather than an empty shell that must be rendered client-side.

The skill provides structured configuration support for integrating SSR into existing Angular projects using a standardized setup process. It introduces server-side bootstrapping files, Express-based server handling, and a dedicated server application configuration that merges with the browser configuration. It also supports route-level rendering strategies through configurable render modes, allowing developers to choose between static prerendering, dynamic server rendering, and client-only execution. In addition, it includes hydration capabilities by default and supports incremental hydration using declarative triggers such as viewport visibility, user interaction, idle time, and conditional logic.

This skill is primarily intended for Angular developers building performance-sensitive or SEO-driven applications such as marketing websites, e-commerce platforms, blogs, dashboards, and content-heavy web apps. It is especially useful for teams that need fine-grained control over rendering strategies per route and want to progressively enhance user experience through selective hydration. It is also relevant for developers migrating existing Angular applications to modern SSR architectures in Angular v20+.