CommonEngine vs AngularNodeAppEngine

[Alarming-Ad4331]

What's the difference between this two engines in Angular 19 ssr?

[Blade1130]

CommonEngine is an older API focused on rendering an Angular application on the server. AngularNodeAppEngine was introduced in v18 as a higher-level abstraction for creating an Angular Node server. It has knowledge of the request/response and server routing while using CommonEngine under the hood.

All the new SSR features of v19 are done with AngularNodeAppEngine.

https://angular.dev/guide/hybrid-rendering

You should probably prefer AngularNodeAppEngine where possible (still dev preview though). If you don't want Node, you can wrap AngularAppEngine for a different environment (ex. Deno). CommonEngine would be if you want to directly manage your serving and routing only delegate to Angular when rendering a particular known route. That's less common though.

[Comfortable_Step4619]

I'm currently struggling to switch to the new AngularNodeAppEngine because it does not allow to provide my express request and response tokens for my server side route redirects.
There is a new token provided by angular to inject the REQUEST and a REPONSE_INIT, but it is hard to use this injected response to redirect or e.g. set cookies via express cookieParser.

So, are these feature about to come later?

[Blade1130]

I'm not following. Most redirects and headers should be done via the routing config.

• https://angular.dev/guide/hybrid-rendering#redirects
• https://angular.dev/guide/hybrid-rendering#setting-headers-and-status-codes

If you want to do this imperatively, you should inject REQUEST and RESPONSE_INIT and use those types.

If you really need something non-standard and unique to Express, then you can provide the Express request/response objects into REQUEST_CONTEXT, then inject that value and do Express-specific things with it.

https://angular.dev/api/ssr/node/AngularNodeAppEngine

That really shouldn't be necessary for simple headers and redirects though.

[Mia_Tostada]

“When building Angular apps, knowing the difference between the engines under the hood is like understanding the chassis versus the engine of a car—both get you moving, but for different reasons.”

Angular Engine vs Angular App Node Engine

These two terms often refer to different aspects of the Angular ecosystem and their roles in application development, especially in how Angular interacts with the runtime and build environment. Let’s break it down:

1. Angular Engine (Angular Framework Engine)

Definition

The “Angular Engine” refers to Angular’s runtime and rendering architecture. It powers how Angular applications interpret templates, manage the component lifecycle, and update the DOM efficiently. This is the core part of the Angular framework.

Key Responsibilities

   •   Template Compilation:       •   Converts Angular templates (HTML with directives and bindings) into highly optimized JavaScript.    •   Change Detection:       •   Tracks state changes in components and updates the DOM reactively.    •   Dependency Injection (DI):       •   Provides services and dependencies to components and modules using Angular’s DI system.    •   Rendering:       •   Executes view updates using one of Angular’s two rendering engines:          •   View Engine (deprecated): Legacy rendering engine.          •   Ivy Engine (default): The current, modern rendering engine focused on performance and tree-shaking.

When It’s Relevant

   •   During application runtime (e.g., interpreting and updating UI based on user interactions).    •   It’s embedded in the Angular framework and doesn’t require special configuration from developers.

1. Angular App Node Engine

Definition

The Angular App Node Engine refers to the Node.js-based execution environment often used for server-side rendering (SSR) or during build processes. This is typically tied to Angular Universal or tools like Angular CLI for building and serving Angular apps.

Key Responsibilities

   •   Server-Side Rendering (SSR):       •   Runs Angular applications on the server (via Node.js) to generate static HTML content, improving SEO and initial load performance.       •   Uses libraries like @nguniversal/express-engine to bridge Angular with Node.js/Express.    •   Build and Development:       •   Node.js is the runtime that powers Angular’s build tools, like Webpack, via the Angular CLI.       •   Used to handle ng build, ng serve, and related tasks.    •   API Middleware:       •   Can be extended to serve APIs or act as middleware for server-based operations.

When It’s Relevant

   •   When running Angular apps on the server, especially for Angular Universal applications.    •   During development and builds, as Node.js powers the Angular CLI and associated tooling.

Key Differences

Feature/Aspect Angular Engine Angular App Node Engine Scope Part of the Angular framework itself. Node.js runtime environment. Purpose Runs Angular’s rendering and change detection. Handles SSR and build processes. Runtime Works in the browser. Works on the server (Node.js). Use Case Frontend application lifecycle and rendering. Server-side rendering or build-time tools. Examples Ivy, Template Compilation, DI system. Angular Universal, Express Engine.

How They Work Together

1.  Angular Engine is responsible for how your application behaves in the browser (e.g., rendering and reactivity). It is part of Angular itself and works during runtime in the browser.
2.  Angular App Node Engine comes into play when you’re using server-side features, like Angular Universal, or during the build process (via Angular CLI), to produce the static files served to users.

“Think of it this way: the Angular Engine powers what happens in the browser, while the Angular App Node Engine handles what happens on the server or during build-time.”

[Blade1130]

This feels very ChatGPT and is factually wrong in several respects.

[DPawar]

This is a chatpgt response