One of the most important parts of building fast Angular applications is using the Ahead of Time (AOT) compiler. The compiler takes all your CSS and HTML with you Component into an NgComponentFactory, which is the JavaScript Virtual-Machine optimized output that is responsible for doing change detection, expression evaluation, etc at runtime.
Make it easy
If you use the Angular CLI, it's easy to turn AOT on for most Angular projects. At build time, simply:ng build --aot --prod
You can also run this during development, but it's going to be slow.
ng serve --prod
This will generate a fully working version of your Angular application in your /dist/ folder. You won't ship the compiler and your application will boot faster than ever.
A couple limits
There are a couple limitations when doing AOT.- All Component and Module metadata has to be statically resolvable - This means you can't do lookups or evaluate complex methods in your
@Component
and@NgModule
metadata. - Double check your
typescript
version, the CLI has trouble with some versions, try typescript@2.0.3 - Add any dynamically loaded components (aka Components never referenced by your router or templates) to your Module's
entryComponents
.