angular-cli icon indicating copy to clipboard operation
angular-cli copied to clipboard

Ability to Prerender Specific Routes Only via CLI or Build Options

Open apappas1129 opened this issue 4 months ago • 1 comments

Which @angular/* package(s) are relevant/related to the feature request?

No response

Description

Currently, Angular's SSG (Static Site Generation) system always prerenders all routes defined in app.routes.server.ts when using ng build --configuration=production.

However, in large-scale, CMS-driven applications, this is often too expensive — especially when only a small subset of dynamic routes (e.g. articles, products, etc.) has changed.

Use Case:

For example:

// app.routes.server.ts
{
  path: 'article/:articleId',
  renderMode: RenderMode.Prerender,
  async getPrerenderParams() {
    return ['2025-new-post', '2024-old-post'].map(id => ({ articleId: id }));
  },
  fallback: PrerenderFallback.Server,
}

When a new article is published, or an existing one is updated, we want to prerender only that article's route — not the entire site. We’re building a webhook from our CMS to trigger a pipeline, but ng build does not support selectively prerendering specific routes.

This forces us to:

  • Rebuild all pages unnecessarily
  • Waste build time and resources
  • Overwrite unchanged prerendered content

The closest workaround is using the low-level @angular/ssg API (e.g. via a custom scripts/prerender-specific.ts), but this is not viable in Angular v17–20 as the @angular/ssg package is not public yet.

References: https://stackoverflow.com/questions/79670012/how-to-pre-render-specific-route-on-cli

Proposed solution

Please provide a way to build/prerender only a specific subset of routes — for example:

ng prerender --routes=/article/2025-new-post,/article/2024-old-post

Benefits:

  • Better integration with headless CMS/webhooks
  • Efficient incremental builds
  • Much faster deployment cycles
  • Avoids regenerating unchanged routes

Alternatives considered

expose @angular/ssg API

apappas1129 avatar Sep 16 '25 08:09 apappas1129

Angular CLI generates unique hashes (like main.1a2b3c4d.js) for its build bundles. All HTML pages reference these specific hashes. If you make a small code change, the next full build creates new bundles with new hashes (e.g., main.5e6f7g8h.js).

If you then only prerender a few pages, those new HTML files correctly link to the new hash. However, the vast majority of your unchanged, existing static HTML pages still link to the old hash (main.1a2b3c4d.js), which is now a non-existent file on the server. This results in a broken application for nearly all routes.

ISR is the Solution ISR resolves this problem by performing page re-generation on the live server environment after the initial deployment. This ensures that the newly generated HTML always references the correct, currently deployed JS/CSS bundle hashes, completely bypassing the dangerous inconsistency created by selective prerendering.

alan-agius4 avatar Sep 16 '25 09:09 alan-agius4