Aspnetcore-angular-universal: server render time takes too long.

[consigliory]

with angular 2.4.5 server render took less then 130ms. Recently I upgraded to 4.0.0 and now it takes 2.5 seconds and more. Any ideas what went wrong?!

[MarkPieszak]

Yikes that's an enormous jump! Is this from a fresh pull down of this Repo here?
I haven't seen times like that, I was seeing around 150-200ms I believe (with all the things his repo has).

Do you have any very long Http processes, setTimeout / setIntervals or Rx timeouts intervals in your code? Any of those could delay it as well.

[consigliory]

there is only one http request for /home and it makes no difference if I remove it. The only diff I can think of is, after update (pull and merged latest from spnetcore-angular2-universal) there was issue with webpack html loader so I replaced templateUrl with template: require(''). Could it be the issue?

[hheexx]

I also have prerendering time in order of 2000-3000ms.
But I have heavy nginx cachging in front of app so it's not terrible.
I have one http call that takes arround 100-200ms.

my node bundle is still on JIT. Does that mean it is compiled for every request ?
I can't manage to implement AOT as I can't reference .ngfactory module in genDir. I receive module cannot be found error.

[MarkPieszak]

JIT means it compiling for every request yes.
The new engine will accept both, but it automatically compiles JIT ngModules to AoT, but of course in prod you'll always want to supply the AoT one.

I'm not sure and not by a computer at the moment I could check a few things tonight @consigliory but I don't see why that would slow it down to that magnitude.

[consigliory]

back to AoT it is all great but your previous project setup was able to render same code in 120ms. Looks like somehow templateUrl and require('..') have some difference and changing back to templateUrl it improved from 2.5 sec to 1.1 second. but it still huge difference

[hheexx]

I don't think 120ms render time for JIT is possible for any non trivial app.
I could not hit <500ms bootstrap time in browser with JIT with all cached using service worker.

[patrickgoeler]

Hey Guys,
I am currently redoing the website of the company I work for. I deployed the project to Azure, but when accessing the site it takes about 13 seconds till the server responds (Time to first byte)..
Any idea what the issue is? :) I have not had the chance to deploy it to a different server to see whether Azure is the problem.. Where would you deploy a website done with this project?
Thanks!

[MarkPieszak]

@consigliory @hheexx so AoT is loading really fast just DevMode isn't right? JIT SSR is just very slow, but I have a big commit coming this morning that actually auto compiles your NgModule to AoT during a server render and caches it (so it doesn't have to keep doing that), this helps performance a lot. I saw 1s-2s renders go down to 300-ish ms. Hopefully that'll solve the problem here !

The ngAspnetCoreEngine has been upgraded a lot (in this next commit), soon it'll be in the official Universal repo and npm (instead of hidden inside the polyfills folder 😀).

Double checking everything and I'll be getting this in shortly today! 🎁

[MarkPieszak]

@patrickgoeler Do you have some sort of timeout / setInterval / (extremely long Http) the server is waiting for? That doesn't sound right.

[patrickgoeler]

No I do not, what I am doing is getting Bootstrap 4, jQuery and Tether via Cdn and we have a whole bunch of images in the site. Also we are handling Bootstrap features like modals with native bootstrap and not ng-bootstrap (yet). Dont know if that makes a difference..

[hheexx]

@MarkPieszak mine node is under JIT. I can't configure AOT as I can't reference module factory in virtual filesystem.
I get module not found error.

I guess I am waiting for new version of ngtools to support platform-server..

[MarkPieszak]

I've upgraded the engine to auto compile your JIT to AoT, and cache them.
Of course for Prod you want to only provide AoT to skip this auto-compile step entirely.

The engine only does SSR with AoT now, so that will help performance a lot, you might see the first 1 or 2 slightly slower when in DEVELOPMENT, but then they'll speed up a lot. I was seeing 100-300ms. (occasionally 15ms, not sure how/why :))

Also I need to remove those CDNs I noticed those are slowing the server response tremendously from time to time...

Merged PR #179

[hheexx]

Does not help me as I can't reference ngfcatory :/

import { ServerAppModuleNgFactory } from './ngfactory/app/server-app.module.ngfactory';

[MarkPieszak]

You must have your webpack and tsconfig references setup wrong? If you're using the repo it ignores that file unless you're specifying the AoT webpack config (which ends up using it instead of the normal main.server)

[hheexx]

I don't know what could be wrong.
I am using combination of this repo and microsoftjavascriptservices template.

I have genDir specified in tsconfig but I can't reference no file in it.

[hheexx]

Made it!

One problem was that AotPlugin does not support instancing it twice.
So I had to change script (like this theme) to call webpack separately to render for node and for browser.

The other problem was I thing that entry module requires full path

[hheexx]

My render times had fallen from 3000ms-7000ms to 100ms-300ms
🎉

[Easyschools]

@MarkPieszak Hello Mark,
I have been following your achievements with universal as I am really impressed with it. I have followed all the github repo to build application with universal as I needed it fully rendered HTML for seo. but I had a situation with my Angular app TTFB it takes about 7 seconds to byte. which I am really it's really huge for it. I have tried everything on the web to increase it's performance with luck. I used App Shell, Webpack and even changed my server to nginx to serve static content but it's the same. Also another problem that the page takes about 18 seconds to fully which is really huge. Although I am using i18n because the application it's multi language. When I used App shell, my TTFB decreased to 60 ms which is ideal but the probelm that the page only rendered in the static html for the homepage for the whole app. If i tried to analyze any route it will return the same html which will effect my SEO. I understand that I can use csr and google can index it but i don't want to target only google and can be indexed from any craweler.
However, I tried using prerender instead of server side and it did it's magic and loaded the page very quickly but the problem that my web app is really huge have about 80k routes which is not logic. Although that I have a huge server that can store all of this but I thought that's would be stupid idea. Do you know any ideas to solve this situation. you will find below my website link and please let me know what do you think with this situation!!!

Linux (Centos) - CPANEL= NGINX- 10 CPU cores & 60 gb ram

www.easyschools.org