Upgrade to Pro
— share decks privately, control downloads, hide ads and more …
Speaker Deck
Features
Speaker Deck
PRO
Sign in
Sign up for free
Search
Search
What’s new in Angular V9 & Deep dive into the n...
Search
Eliran Eliassy
March 26, 2020
Technology
1
250
What’s new in Angular V9 & Deep dive into the new Renderer Injector
Eliran Eliassy
March 26, 2020
Tweet
Share
More Decks by Eliran Eliassy
See All by Eliran Eliassy
Module Federation in practice with NX link
eliraneliassy
0
240
Angular Core Abstractions - The ItreableDiffer
eliraneliassy
0
340
Custom Components Templates
eliraneliassy
0
140
Understanding the Angular Injector
eliraneliassy
0
180
What are RXJS schedulers and why we need them to test observables
eliraneliassy
0
150
Everything you need to know about Angular Ivy
eliraneliassy
1
930
Bye bye NgModules
eliraneliassy
1
870
Change detection in the world of Ivy
eliraneliassy
1
210
Angular generic forms
eliraneliassy
0
460
Other Decks in Technology
See All in Technology
2025-04-14 Data & Analytics 井戸端会議 Multi tenant log platform with Iceberg
kamijin_fanta
1
180
企業が押さえるべきMCPの未来
takaakikakei
4
910
『ささAI』ネタづくりをささえるAI📝 (にぼしいわし担当:GIFTech2025)
masapyon1212
0
100
Serverlessだからこそコードと設計にはこだわろう
kenichirokimura
2
530
Global Azure2025(GitHub Copilot ハンズオン)
tomokusaba
1
540
Previewでもここまで追える! Azure AI Foundryで始めるLLMトレース
tomodo_ysys
2
440
DynamoDB のデータを QuickSight で可視化する際につまづいたこと/stumbling-blocks-when-visualising-dynamodb-with-quicksight
emiki
0
130
ビジネスとデザインとエンジニアリングを繋ぐために 一人のエンジニアは何ができるか / What can a single engineer do to connect business, design, and engineering?
kaminashi
2
880
Part1 GitHubってなんだろう?その2
tomokusaba
1
540
10分で学ぶ、RAGの仕組みと実践
supermarimobros
0
880
Oracle Base Database Service 技術詳細
oracle4engineer
PRO
7
63k
クラウドネイティブ環境の脅威モデリング
kyohmizu
1
370
Featured
See All Featured
Principles of Awesome APIs and How to Build Them.
keavy
126
17k
Practical Tips for Bootstrapping Information Extraction Pipelines
honnibal
PRO
19
1.2k
Statistics for Hackers
jakevdp
798
220k
XXLCSS - How to scale CSS and keep your sanity
sugarenia
248
1.3M
Agile that works and the tools we love
rasmusluckow
329
21k
Templates, Plugins, & Blocks: Oh My! Creating the theme that thinks of everything
marktimemedia
30
2.3k
[Rails World 2023 - Day 1 Closing Keynote] - The Magic of Rails
eileencodes
34
2.2k
Thoughts on Productivity
jonyablonski
69
4.6k
The Straight Up "How To Draw Better" Workshop
denniskardys
233
140k
The Web Performance Landscape in 2024 [PerfNow 2024]
tammyeverts
5
560
The Cost Of JavaScript in 2023
addyosmani
49
7.8k
Building a Scalable Design System with Sketch
lauravandoore
462
33k
Transcript
What’s new in Angular V9 & Deep dive into the
new Renderer Injector eliraneliassy
e-square.io — Founder & CEO @ e-square.io — GDE for
Angular & Web Technologies — Writer for AngularInDepth — Community leader About mySelf
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
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
e-square.io Hello, Angular Ivy! 1. Smaller Bundle size 2. Faster
Compilations 3. Simpler Debugging 4. Improve type checking 5. Backwards compatible
e-square.io Ivy is enabler
Bundle Size e-square.io
e-square.io http://bit.ly/all-you-need-to-know- angular-ivy http://bit.ly/the-future-of-angular- components
Faster Unit test e-square.io • 40-50% faster • Don’t recompile
between tests
Debugging e-square.io ng object available in the code!
Build Errors e-square.io
Strict Template e-square.io • fullTemplateTypeCheck — Old behaviour that type
checks most things • strictTemplates — New Option: Check everything with the strictest rules
Component Harness e-square.io • Test API for components and directives
• Faster & safer • Less boilerplate
e-square.io Improve CD - NgZone Event Coalescing
e-square.io R3Injector
e-square.io ProvidedIn - new options
e-square.io What are Injectors? • Injector is a Key-Value map
of Token -> Provider
e-square.io Injector - get and register
e-square.io Creating providers
e-square.io Injecting the provider
e-square.io Resolve the Provider - component level
e-square.io Resolve the Provider
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.
e-square.io Resolve the Provider - Module level
e-square.io Resolve the Provider - special decorators • @Optional() •
@Host() • @SkipSelf() • @Self()
e-square.io How it work behind the scenes • Injector is
a Key-Value map of Token -> Provider
e-square.io The magic - @Injectable
e-square.io The magic - defineInjectable
e-square.io R3Injector
e-square.io Micro-Front end? Not yet…
e-square.io Where else then?
We’re here to help you!
Thank You @eliraneliassy
[email protected]
eliraneliassy https://eliassy.dev https://e-square.io