Tools for fast Angular applications

Transcript

1. 1.

   None
2. 2.

   Tools for Fast Angular Applications Improving the time to interactive

   of your app Minko Gechev @mgechev
3. 3.

   Practices for speed automated with the Angular CLI & schematics

   Code-splitting Efficient serving Bundle Preloading
4. 4.

   None
5. 5.

   None
6. 6.

   Practices for speed automated with the Angular CLI & schematics

   Code-splitting Efficient serving Bundle Preloading
7. 7.

   Automatic code-splitting Angular CLI version 8.1 $ ng g module

   about --route about --module app
8. 8.

   Automatic code-splitting Angular CLI version 8.1 $ ng g module

   about --route about --module app module name
9. 9.

   Automatic code-splitting Angular CLI version 8.1 $ ng g module

   about --route about --module app lazy-route path
10. 10.

    Automatic code-splitting Angular CLI version 8.1 $ ng g module

    about --route about --module app parent module name
11. 11.

    None
12. 12.

    Generated a lazy-route • Defined an NgModule • Declared a

    lazy-route • Declared a default route • Defined a component
13. 13.

    None
14. 14.

    None
15. 15.

    Practices for speed automated with the Angular CLI & schematics

    Code-splitting Efficient serving Bundle Preloading
16. 16.

    None
17. 17.

    ngx-quicklink • Detects links in the viewport • Waits until

    the browser is idle • Checks user’s connection • Prefetches the lazy modules
18. 18.

    None
19. 19.

    None
20. 20.

    None
21. 21.

    Practices for speed automated with the Angular CLI & schematics

    Code-splitting Efficient serving Bundle Preloading
22. 22.

    None
23. 23.

    None
24. 24.

    • ng add a platform module • Run ng deploy

    Deployment via Angular CLI Introduced in CLI v8.3
25. 25.

    None
26. 26.

    Supported platforms for automatic deployments via the Angular CLI @angular/fire

    @azure/ng-deploy @zeit/ng-deploy angular-cli-ghpages @netlify-builder/deploy ngx-deploy-npm
27. 27.

    Practices for speed automated with the Angular CLI & schematics

    Code-splitting Efficient serving Bundle Preloading
28. 28.

    Practices for speed automated with the Angular CLI & schematics

    Code-splitting Efficient serving Bundle Preloading
29. 29.

    Practices for speed automated with the Angular CLI & schematics

    Code-splitting Efficient serving Bundle Preloading
30. 30.

    Practices for speed automated with the Angular CLI & schematics

    Code-splitting Efficient serving Bundle Preloading
31. 31.

    None
32. 32.

    Thank you! Minko Gechev @mgechev