问题
Angular Universal is for Server side rendering.
I have a full functional Angular app. To increase FCP. I need to hydrate with server side rendering.
Is Angular universal allows dynamic SSR. Loading certain components in server side ?
I couldn't find anything related to that.(Yes I did some google search on it).
I have found similar topic here,but i need to know more than that.
The dicision boundary between Angular & Angular Universal.
Found some articles related here.
Does it bypass data to back-end or it doesn't care about data,only renders static data ?
Is following scenario possible in angular universal
If I have three components on a page
<Comp1></Comp1>
<Comp2><Comp2>
<Comp3><Comp3>
Comp1 and Comp3 are mostly static .Comp2 is user specific. I don't want comp2 to be rendered in server side. Comp1 and Comp3 from server rendering and Comp2 on client side.
回答1:
The way angular universal works is that components are rendere server side, and then, once the page is loaded, the client-side angular app takes over and re-render the components.
You can sometimes have some flicker while the client-side requests data from the API if you do not use State Transfer.
If all you want is not to render Comp2 server side, then you can simply add some cndition based on the platform (browser/server)
template.html
<Comp1></Comp1>
<Comp2 *ngIf=isBrowser></Comp2>
component.html
import {Injectable, Inject, PLATFORM_ID, Optional} from '@angular/core';
import {isPlatformBrowser} from "@angular/common";
isBrowser: boolean = false;
constructor(@Inject(PLATFORM_ID) private platformId: Object)
{
this.isBrowser = isPlatformBrowser(this.platformId);
}
But note that Comp1 will be rendered again client side anyway
回答2:
Don't know if it will cover all your needs, but you can make the static website and use web-elements as dynamic components as it used on agular.io website. Also, you can lazily import those components on click or some other event.
来源：https://stackoverflow.com/questions/57311931/ssr-with-rehydration-in-angular