Task Queue

12/31/2021

Working on universal server page rendering in combination with migrating to open search.

Universal server is not waiting long enough to allow page rendering. Need to identify the cause of this. The page is being handed off to the browser in incomplete state without content. This doesn't really impact experience because Angular will than navigate properly in the browser but that content is not physically part of the dom. The primary goal of universal rendering is to make the page content physically part of the dom.

Someone in a thread made an interesting point as to what could be the cause of this.

Yeah I did understand the problem, but this is often caused because of a server side error during SSR (not talking about the API, but the nodejs process doing SSR). If everything is fine server side, I'm not sure what could be causing the issue.

Thread Reference: https://stackoverflow.com/questions/52270397/angular-6-angular-universal-not-waiting-on-content-api-call

Finally some progress:

https://github.com/angular/angular/issues/20520

Possible implementation code:

https://gist.github.com/alvarotf/95ba4ad6355be50d28b338d51dec1683

Some of the state from the server side application needs to also be transfered over to reduce duplication and optimize. For example the requests to grab the panelpagelist items that are used to route the application should probably be transfered from the backend.

I'm concerned though that when the pages catchall guard navigates to the requested page the server side is short circuiting causing the page to render prematurely. Need to investigate if this is indeed the case.

The cause of the routing short circuit is resolving false on the gaurd. Even though the redirect is called when the canActivate gaurd resolves as false the page is "done" rendering. A url tree probably needs to be used instead.

Query string params being included as part of params to panelpagelistitems open search template. This is causing an error. The query string params should be excluded. We could consider making them part of the match but that isn't currently supported anyway.

  originalAction: {
    type: '[PanelPageListItem] @ngrx/data/query-many',
    payload: {
      entityName: 'PanelPageListItem',
      entityOp: '@ngrx/data/query-many',
      data: 'path={"term":{"path.keyword":{"value":"/formly"}}}&path={"term":{"path.keyword":{"value":"/formly/kitchensink"}}}&path={"term":{"path.keyword":{"value":"/formly/kitchensink/v1?hello=world"}}}&site=ipe',
      correlationId: 'CRID2'
    }
  }