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
New router on the block - Angular Vienna Dec '20
Search
Miroslav Jonaš
December 21, 2020
Programming
0
190
New router on the block - Angular Vienna Dec '20
Miroslav Jonaš
December 21, 2020
Tweet
Share
More Decks by Miroslav Jonaš
See All by Miroslav Jonaš
The dark art of code optimization
meeroslav
0
15
Drum 'n' JS
meeroslav
0
31
Monorepo demystified: Breaking the myth
meeroslav
0
21
Making the Argument for Monorepos
meeroslav
0
12
Scaling Vendure with Nx
meeroslav
0
120
Don't let compilation set the length of your Glühwein break
meeroslav
0
72
Vanquishing deployment dragons with Nx wizardry
meeroslav
0
200
Don't let compilation set the length of your coffee break
meeroslav
0
100
The other JavaScript performance (no one is talking about)
meeroslav
0
260
Other Decks in Programming
See All in Programming
ИИ-Агенты в каждый дом – Алексей Порядин, PythoNN
sobolevn
0
150
CI_CD「健康診断」のススメ。現場でのボトルネック特定から、健康診断を通じた組織的な改善手法
teamlab
PRO
0
180
デミカツ切り抜きで面倒くさいことはPythonにやらせよう
aokswork3
0
190
Goで実践するドメイン駆動開発 AIと歩み始めた新規プロダクト開発の現在地
imkaoru
4
590
非同期jobをtransaction内で 呼ぶなよ!絶対に呼ぶなよ!
alstrocrack
0
520
LLMとPlaywright/reg-suitを活用した jQueryリファクタリングの実際
kinocoboy2
4
670
Let's Write a Train Tracking Algorithm
twocentstudios
0
220
10年もののAPIサーバーにおけるCI/CDの改善の奮闘
mbook
0
770
複雑化したリポジトリをなんとかした話 pipenvからuvによるモノレポ構成への移行
satoshi256kbyte
1
770
ネイティブ製ガントチャートUIを作って学ぶUICollectionViewLayoutの威力
jrsaruo
0
130
プロダクト開発をAI 1stに変革する〜SaaS is dead時代で生き残るために〜 / AI 1st Product Development
kobakei
0
490
NetworkXとGNNで学ぶグラフデータ分析入門〜複雑な関係性を解き明かすPythonの力〜
mhrtech
3
1k
Featured
See All Featured
Easily Structure & Communicate Ideas using Wireframe
afnizarnur
194
16k
What’s in a name? Adding method to the madness
productmarketing
PRO
23
3.7k
Imperfection Machines: The Place of Print at Facebook
scottboms
269
13k
Unsuck your backbone
ammeep
671
58k
How to train your dragon (web standard)
notwaldorf
96
6.3k
The Invisible Side of Design
smashingmag
301
51k
Docker and Python
trallard
46
3.6k
What's in a price? How to price your products and services
michaelherold
246
12k
Automating Front-end Workflow
addyosmani
1371
200k
Responsive Adventures: Dirty Tricks From The Dark Corners of Front-End
smashingmag
252
21k
Music & Morning Musume
bryan
46
6.8k
The Pragmatic Product Professional
lauravandoore
36
6.9k
Transcript
NEW ROUTER ON THE BLOCK Miroslav Jonaš @meeroslav
HELLO! I am Miroslav Jonaš @meeroslav
History of angular routing angularjs ui-router @angular/router @ngrx/router react-router angular-routing
2010 2013 2014 2016 2017 2020 angular-route ng v2 v4 v11 @meeroslav
Brandon Roberts @meeroslav
Short history of angular-routing CREATED June 23rd TWEET July 2nd
FIRST PR July 13th @meeroslav
@meeroslav
@meeroslav
@meeroslav
OK… SO WHAT’S DIFFERENT? Well, glad you asked @meeroslav
621kB Entire package 2 Dependencies 18kB UMD/Ivy bundle size *
SIZE MATTERS! @meeroslav
GUARDS? JUST NGIF-IT @meeroslav
INVALID ROUTE ORDER @meeroslav
Where we’re going THERE IS NO INVALID ROUTE ORDER @meeroslav
RESPONSIVE ROUTING ROUTER R O U T E R @meeroslav
RECURSIVE ROUTES RECURSIVE ROUTES RECURSIVE ROUTES RECURSIVE ROUTES RECURSIVE ROUTES
RECURSIVE ROUTES RECURSIVE ROUTES RECURSIVE ROUTES RECURSIVE ROUTES RECURSIVE ROUTES @meeroslav
IS IT A REPLACEMENT? No, an upgrade! @meeroslav
NOW? Depends... @meeroslav
IF YOU NEED... › Redirections › Nesting › Lazy loading
› Guards › Stream of Params › Auxiliary routes @meeroslav
BUT IF YOU NEED... › Complex guards › All params
stream › Resolves › Some other config/event magic @meeroslav
@meeroslav “Step-by-step” approach
“Ask not what Angular can do for you - ask
what you can do for Angular” @meeroslav John F. Kennedy
THANKS! Any questions? @meeroslav https://github.com/brandonroberts/angular-routing https://recursive-ng-router.netlify.app/ https://responsive-ng-router.netlify.app/ › Presentation template
by SlidesCarnival