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
The State of Angular
Search
Minko Gechev
May 07, 2020
Programming
1
210
The State of Angular
Minko Gechev
May 07, 2020
Tweet
Share
More Decks by Minko Gechev
See All by Minko Gechev
Change the World With Open Source Software
mgechev
0
180
Fast Angular Apps from End to End
mgechev
1
190
The State of Angular
mgechev
1
190
The State of Angular
mgechev
1
370
Software Engineering as a Superpower
mgechev
1
190
Introduction to Angular
mgechev
1
200
Internals of the Angular CLI
mgechev
2
1.3k
The State of Angular Deployment, SSR, and Prerendering, ng-conf keynote
mgechev
2
2.9k
The Future of the Front-End Frameworks
mgechev
2
320
Other Decks in Programming
See All in Programming
テスターからテストエンジニアへ ~新米テストエンジニアが歩んだ9ヶ月振り返り~
non0113
2
240
オホーツクでコミュニティを立ち上げた理由―地方出身プログラマの挑戦 / TechRAMEN 2025 Conference
lemonade_37
1
360
ご注文の差分はこちらですか? 〜 AWS CDK のいろいろな差分検出と安全なデプロイ
konokenj
4
720
[DevinMeetupTokyo2025] コード書かせないDevinの使い方
takumiyoshikawa
2
230
AIコーディングエージェント全社導入とセキュリティ対策
hikaruegashira
15
8.7k
CIを整備してメンテナンスを生成AIに任せる
hazumirr
0
370
コーディングエージェント概観(2025/07)
itsuki_t88
0
460
なぜあなたのオブザーバビリティ導入は頓挫するのか
ryota_hnk
4
520
Comparing decimals in Swift Testing
417_72ki
0
140
知って得する@cloudflare_vite-pluginのあれこれ
chimame
1
130
変化を楽しむエンジニアリング ~ いままでとこれから ~
murajun1978
0
590
顧客の画像データをテラバイト単位で配信する 画像サーバを WebP にした際に起こった課題と その対応策 ~継続的な取り組みを添えて~
takutakahashi
4
1.4k
Featured
See All Featured
The Language of Interfaces
destraynor
158
25k
Fashionably flexible responsive web design (full day workshop)
malarkey
407
66k
RailsConf 2023
tenderlove
30
1.2k
CSS Pre-Processors: Stylus, Less & Sass
bermonpainter
357
30k
Optimising Largest Contentful Paint
csswizardry
37
3.4k
The Cost Of JavaScript in 2023
addyosmani
51
8.7k
[Rails World 2023 - Day 1 Closing Keynote] - The Magic of Rails
eileencodes
35
2.5k
Refactoring Trust on Your Teams (GOTO; Chicago 2020)
rmw
34
3.1k
Measuring & Analyzing Core Web Vitals
bluesmoon
7
530
For a Future-Friendly Web
brad_frost
179
9.8k
Thoughts on Productivity
jonyablonski
69
4.8k
CoffeeScript is Beautiful & I Never Want to Write Plain JavaScript Again
sstephenson
161
15k
Transcript
@yourtwitter The State of Angular Minko Gechev twitter.com/mgechev github.com/mgechev blog.mgechev.com
@yourtwitter https://unsplash.com/photos/rafblRbne3o
@mgechev v9.1 is out
@mgechev
@mgechev Smaller Faster builds Better debugging Better type checking Improved
build errors Simpler Improved i18n Improvements in Universal
@mgechev Smaller Faster builds Better debugging Better type checking Improved
build errors Simpler Improved i18n Improvements in Universal
Predictability vs Flexibility trade-offs Predictable Flexible
Static vs Dynamic trade-offs Static Dynamic
Static vs Dynamic trade-offs Static Dynamic
• Great compile-time optimizations • Excellent IDE/text editor support •
Strict type checking • Source code visualization • Lazy component loading • Dynamic UI assembling • Fast builds Static Dynamic
• Great compile-time optimizations • Excellent IDE/text editor support •
Strict type checking • Source code visualization • Lazy component loading • Dynamic UI assembling • Fast builds Static Dynamic
• Great compile-time optimizations • Excellent IDE/text editor support •
Strict type checking • Source code visualization • Lazy component loading • Dynamic UI assembling • Fast builds Static Dynamic 2.0 4.0
• Great compile-time optimizations • Excellent IDE/text editor support •
Strict type checking • Source code visualization • Lazy component loading • Dynamic UI assembling • Fast builds Static Dynamic 4.0 9.0
• Great compile-time optimizations • Excellent IDE/text editor support •
Strict type checking • Source code visualization • Lazy component loading • Dynamic UI assembling • Fast builds Static Dynamic 9.0
@mgechev So, Angular is now more dynamic!
@mgechev …but not too dynamic
@mgechev • Do something • Collect feedback • Adjust direction
“Gradient descent” optimization
@mgechev • Do something • Collect feedback • Adjust direction
“Gradient descent” optimization
twitter.com/mgechev @mgechev
@mgechev Google Community
@mgechev
@mgechev Faster builds -40%
@mgechev VE @Component({ selector: 'app', template: ' ...' }) class
AppComponent { ... } app.ngfactory.js app.ngsummary.json app.metadata.json app.component.js app.component.d.ts
@mgechev Ivy @Component({ selector: 'app', template: ' ...' }) class
AppComponent { ... } app.component.js app.component.d.ts
@mgechev Faster builds • We do less work • No
longer generate factories • ngcc does this once* • No longer using metadata.json • Incremental AoT builds
@mgechev Faster builds • We do less work • No
longer generate factories • ngcc does this once* • No longer using metadata.json • Incremental AoT builds AoT in development
@mgechev
@mgechev
@mgechev
@mgechev Smaller bundles • Less generated code • Smaller framework
@mgechev Smaller framework • Tree-shakable instructions • No need for
ngfactory machinery
@mgechev Improved i18n
Angular compile-time i18n (v2-v8) src lib Link & optimize ngc
ngc l10n l10n l10n l10n
Angular compile-time i18n (v2-v8) src lib Link & optimize ngc
ngc l10n l10n repeat
@mgechev Focused on static optimizations • Generate app at compile-time:
• No runtime binding overhead • Smaller bundles: • Localizations are hard to tree-shake • No need for binding instructions
Angular compile-time i18n (Ivy) src lib Link & optimize l10n
repeat ngc
@mgechev Angular Universal
@mgechev Challenges with Universal • Change-refresh time • Deployment
@yourtwitter $ ng add @nguniversal/express-engine $ ng run [PROJECT_NAME]:serve-ssr New
in v9!
@yourtwitter $ ng update @nguniversal/express-engine
twitter.com/mgechev @ManfredSteyer @AlanAgius4 @mgechev
twitter.com/mgechev Deployment
twitter.com/ mgechev New in @angular/fire
New in @angular/fire
twitter.com/ mgechev New in @angular/fire
twitter.com/mgechev Request / HTML @mgechev Request scripts JS TTI Run
app on server LCP
twitter.com/mgechev Request / HTML @mgechev Request scripts JS TTI Run
app on server LCP If not cached Return from the cache Cache LCP
@mgechev Prerendering
@yourtwitter $ ng add @nguniversal/express-engine $ ng run [PROJECT_NAME]:prerender Using
Universal at build-time New in v9!
@mgechev Building the app Prerendering <2s for 800 pages ng
run app:prerender
twitter.com/mgechev
twitter.com/mgechev @mgechev JAMStack By HeroDevs
twitter.com/mgechev @mgechev
@mgechev Thank you! twitter.com/mgechev github.com/mgechev blog.mgechev.com Survey: mgv.io/talk