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
250510 StepFunctionのテスト自動化始めました vol.1
east_takumi
1
150
OPENLOGI Company Profile for engineer
hr01
1
26k
Terraform にコントリビュートしていたら Azure のコストをやらかした話 / How I Messed Up Azure Costs While Contributing to Terraform
nnstt1
1
260
Part1 GitHubってなんだろう?その2
tomokusaba
1
520
Azure × MCP 入門
ry0y4n
7
1.3k
Ninno LT
kawaguti
PRO
1
110
MySQL Indexes and Histograms – How they really speed up your queries
lefred
0
150
データベース04: SQL (1/3) 単純質問 & 集約演算
trycycle
PRO
0
720
SnowflakeとDatabricks両方でRAGを構築してみた
kameitomohiro
1
590
Oracle Base Database Service 技術詳細
oracle4engineer
PRO
7
63k
AIエージェント開発手法と業務導入のプラクティス
ykosaka
9
2.7k
Microsoft の SSE の現在地
skmkzyk
0
300
Featured
See All Featured
Faster Mobile Websites
deanohume
306
31k
"I'm Feeling Lucky" - Building Great Search Experiences for Today's Users (#IAC19)
danielanewman
227
22k
The Myth of the Modular Monolith - Day 2 Keynote - Rails World 2024
eileencodes
23
2.7k
Visualizing Your Data: Incorporating Mongo into Loggly Infrastructure
mongodb
45
9.5k
Let's Do A Bunch of Simple Stuff to Make Websites Faster
chriscoyier
507
140k
A better future with KSS
kneath
239
17k
Gamification - CAS2011
davidbonilla
81
5.3k
Save Time (by Creating Custom Rails Generators)
garrettdimon
PRO
31
1.2k
Being A Developer After 40
akosma
91
590k
Building a Modern Day E-commerce SEO Strategy
aleyda
40
7.2k
Speed Design
sergeychernyshev
29
930
CoffeeScript is Beautiful & I Never Want to Write Plain JavaScript Again
sstephenson
160
15k
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 eliran.eliassy@gmail.com eliraneliassy https://eliassy.dev https://e-square.io