2. Server-Side Rendering

Activity 9: Implementing the Transfer State Cache

Solution:

1. Import TransferHttpCacheModule from @nguniversal/common in AppModule:

   import { TransferHttpCacheModule } from '@nguniversal/common';

2. Next, import ServerTransferStateModule from @angular/platform-server in AppServerModule:

   import { ServerTransferStateModule } from '@angular/platform-server';

Now when you create a new build of the app, you will only see that the API request gets made once.

If you view the source of the server-side rendered page, you should see the application state as a snippet of JSON at the bottom of the page:

Figure 2.22: Viewing the source of the server-side rendered page