What’s new in Angular V9 & Deep dive into the new Renderer Injector

Transcript

1. What’s new in Angular V9 & Deep dive into the new Renderer Injector eliraneliassy
2. e-square.io — Founder & CEO @ e-square.io — GDE for Angular & Web Technologies — Writer for AngularInDepth — Community leader About mySelf
3. e-square.io 1. Bundle size 2. Testing 3. Debugging 4. CSS Binding 5. Build Errors 6. Build speed What’s new In Angular 9 7. Improve CD 8. Strict Templates 9. providedIn 10.Harnesses 11. New Components 12. TypeScript 3.7 13. Universal
4. e-square.io 1. Bundle size 2. Testing 3. Debugging 4. CSS Binding 5. Build Errors 6. Build speed What’s new In Angular 9 7. Improve CD 8. Strict Templates 9. providedIn 10.Harnesses 11. New Components 12. TypeScript 3.7 13. Universal
5. e-square.io Hello, Angular Ivy! 1. Smaller Bundle size 2. Faster Compilations 3. Simpler Debugging 4. Improve type checking 5. Backwards compatible
6. e-square.io Ivy is enabler
7. Bundle Size e-square.io
8. e-square.io http://bit.ly/all-you-need-to-know- angular-ivy http://bit.ly/the-future-of-angular- components
9. Faster Unit test e-square.io • 40-50% faster • Don’t recompile between tests
10. Debugging e-square.io ng object available in the code!
11. Build Errors e-square.io
12. Strict Template e-square.io • fullTemplateTypeCheck — Old behaviour that type checks most things • strictTemplates — New Option: Check everything with the strictest rules
13. Component Harness e-square.io • Test API for components and directives • Faster & safer • Less boilerplate
14. e-square.io Improve CD - NgZone Event Coalescing
15. e-square.io R3Injector
16. e-square.io ProvidedIn - new options
17. e-square.io What are Injectors? • Injector is a Key-Value map of Token -> Provider
18. e-square.io Injector - get and register
19. e-square.io Creating providers
20. e-square.io Injecting the provider
21. e-square.io Resolve the Provider - component level
22. e-square.io Resolve the Provider
23. e-square.io providedIn levels • ‘root’: The application-level injector in most apps. • ‘any’: Provides a unique instance in every module 
 (including lazy modules) that injects the token. • ‘platform’: A special singleton platform injector shared by all applications on the page.
24. e-square.io Resolve the Provider - Module level
25. e-square.io Resolve the Provider - special decorators • @Optional() • @Host() • @SkipSelf() • @Self()
26. e-square.io How it work behind the scenes • Injector is a Key-Value map of Token -> Provider
27. e-square.io The magic - @Injectable
28. e-square.io The magic - defineInjectable
29. e-square.io R3Injector
30. e-square.io Micro-Front end? Not yet…
31. e-square.io Where else then?
32. We’re here to help you!
33. Thank You @eliraneliassy eliran.eliassy@gmail.com eliraneliassy https://eliassy.dev https://e-square.io