diff --git a/server.ts b/server.ts index 81137ad56a8..b65fb177b7e 100644 --- a/server.ts +++ b/server.ts @@ -116,6 +116,7 @@ export function app() { server.engine('html', (_, options, callback) => ngExpressEngine({ bootstrap: ServerAppModule, + inlineCriticalCss: environment.universal.inlineCriticalCss, providers: [ { provide: REQUEST, diff --git a/src/config/universal-config.interface.ts b/src/config/universal-config.interface.ts index c088dcd6579..3ff68fea664 100644 --- a/src/config/universal-config.interface.ts +++ b/src/config/universal-config.interface.ts @@ -4,4 +4,13 @@ export interface UniversalConfig extends Config { preboot: boolean; async: boolean; time: boolean; + + /** + * Whether to inline "critical" styles into the server-side rendered HTML. + * + * Determining which styles are critical is a relatively expensive operation; + * this option can be disabled to boost server performance at the expense of + * loading smoothness. + */ + inlineCriticalCss?; } diff --git a/src/environments/environment.production.ts b/src/environments/environment.production.ts index 09b5f19ade6..7dd9bd2aa3b 100644 --- a/src/environments/environment.production.ts +++ b/src/environments/environment.production.ts @@ -7,6 +7,7 @@ export const environment: Partial = { universal: { preboot: true, async: true, - time: false + time: false, + inlineCriticalCss: true, } }; diff --git a/src/environments/environment.ts b/src/environments/environment.ts index dc0e808be0d..10f71618e1b 100644 --- a/src/environments/environment.ts +++ b/src/environments/environment.ts @@ -12,7 +12,8 @@ export const environment: Partial = { universal: { preboot: false, async: true, - time: false + time: false, + inlineCriticalCss: true, } };