Usage

Setting the Response Status Code

Inject the DAFF_SSR_RESPONSE and call status to set the status code on the SSR document response.

app.component.ts

import { DaffSsrResponse, DAFF_SSR_RESPONSE } from '@daffodil/ssr'

@Component()
class AppComponent {
  constructor(
    @Inject(DAFF_SSR_RESPONSE) private response: DaffSsrResponse
  ) {
    this.response.status(404);
  }
}

Adding a Response Header

Inject the DAFF_SSR_RESPONSE and call append to add a header to the SSR document response.

app.component.ts

import { DaffSsrResponse, DAFF_SSR_RESPONSE } from '@daffodil/ssr'

@Component()
class AppComponent {
  constructor(
    @Inject(DAFF_SSR_RESPONSE) private response: DaffSsrResponse
  ) {
    this.response.append('Link', '<https://www.mydomain.com>; rel=preconnect');
  }
}

Asset Preloading

Preloading certain important assets can boost the initial render of a page. By including Link headers on the SSR document response, the browser can load these assets while parsing the HTML.

Daffodil provides a DaffSsrHeaderLinkAssetPreloader service to assist this process. The following example demonstrates how to preload an asset that is needed for the initial render of a page.

import {
  DaffSsrHeaderLinkAssetPreloader,
  DaffSsrHeadersLinkPreloadAssetKind,
  DaffSsrHeadersLinkPreloadAssetPriority,
} from '@daffodil/ssr'

@Component()
class AppComponent {
  constructor(
    private assetPreloadService: DaffSsrHeaderLinkAssetPreloader
  ) {
    this.assetPreloadService.addHeader(
      '/asset/logo.png',
      DaffSsrHeadersLinkPreloadAssetKind.IMAGE,
      DaffSsrHeadersLinkPreloadAssetPriority.HIGH,
    );
  }
}