6
votes

This is the result that I am getting when I am doing only server side rendering (without bootstraping client side). This means the page served cannot be interacted with as no js execution takes place on browser.

First Contentful Paint: 0.6 s First Meaningful Paint: 0.6 s Speed Index: 0.6 s First CPU Idle: 1.5 s Time to Interactive: 1.7 s Max Potential First Input Delay:140 ms

Overall score: 99


This is the result that I am getting when I am doing rendering using Angular universal and preboot (server side rendering + client side rendering). Page is fully interactive.

First Contentful Paint: 0.6 s First Meaningful Paint: 0.6 s Speed Index: 2.5 s First CPU Idle: 2.6 s Time to Interactive: 3.3 s Max Potential First Input Delay:160 ms

Overall score: 75


It is clearly evident that Speed Index, First CPU Idle and Time to Interactive were badly hampered when I tried to execute javascript on client side as well.

I am not sure how to decrease this. Using Angular Universal and preboot.

When I am not using Angular Universal (only client side rendering) even then the scores are better than using server side rendering + client side rendering. I require server side rendering for SEO purposes.

What could be the issue?

1
Check this thread: github.com/GoogleChrome/lighthouse/issues/10845. And this one back from 2018: github.com/GoogleChrome/lighthouse/issues/4578. It seems like because of re-hydration Angular Universal gets its core metrics delayed resulting in a poor scores. - 0leg

1 Answers

1
votes

Since 2019 google prefer TTI to FCP.. This is the problem, the solution i did not found.

Here some tips i read just now

https://code101.net/code-101/replacing-angular-with-plain-javascript-modules