我的 Angular 2 应用程序第一次加载非常缓慢

Question

Why is my Angular app loading so slow for the first time? What is causing the compiler.umd.js to take almost 5 seconds to load before other files are allowed to load?

Answer 1

I think you are not using any bundle tools like webpack, systemjs..

When you deploy your ng2-app, I should use AOT(ahead of time) compile. I guess you are using JIT(just in time) compile.

In angular2 guide page,

With AOT, the browser downloads a pre-compiled version of the application. The browser loads executable code so it can render the application immediately, without waiting to compile the app first.

When you use JIT compile, your browser will download vendor.js which is defined angular2 compiler and it will compile your app just in time. It will be too slow.

I recommend to use AOT compile when you deploy, and use lazy loading for resource size.

If you are curious about ng2 AOT compile, read this guide.

angualar2-cookbook-AOT

And here is example angular2 app with webpack2 and lazy load.

files bundled with aot is smaller than 500KB.

angular2-webpack2-aot