Server side Rendering shows output as HTML string rather properly formatted HTML

Viewed 100

My site is using Angular 10 (With server side rendering). I referred to https://angular.io/guide/universal to convert the site into SSR. Everything is working fine. 'View Source' shows me the content, I can share with Social Media. My node server does not give me any error.

The only issue I am facing is - When it is rendered through the node server, it shows as HTML string. For few seconds user sees below:

<!DOCTYPE html> <html> <head> </head> <body> <h3>Step 1 - Add environment variable&nbsp;</h3> <p> ......</p> </body> </html>  

Later it switches back to properly formatted HTML. The same is the case with material icons used on site. I see them as strings initially.

Please check out the link https://ecokrypt.com/dashboard/article/detail/5e59df2b00190207e65d9e99/4.3---Angular%253A-Consider-Different-Environments

Slow network throttling shows the issue clearly. This is giving a very bad end-user experience. Am I missing any step in SSR? How can I handle this? I tried to search this issue on google, but no luck.

0 Answers
Related