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
MicroFrontends – Vergangenheit, Gegenwart & Zuk...
Search
SQUER Solutions
May 06, 2021
Technology
0
350
MicroFrontends – Vergangenheit, Gegenwart & Zukunft
JAX Mainz / Remote
SQUER Solutions
May 06, 2021
Tweet
Share
More Decks by SQUER Solutions
See All by SQUER Solutions
Demystifying Event Sourcing – A Practical Approach by Shahab Ganji
squer
0
64
Architecting Distributed Systems at Scale — From Pain to Pattern
squer
0
160
Empowering-developers-with-Roslyn.pdf
squer
0
90
Building Event Driven Systems at Scale with Azure Cosmos DB
squer
0
120
Building Event-Driven Systems at Scale with Azure Cosmos DB
squer
0
82
Platform Engineering: It's Not What You Think It Is
squer
0
240
Patterns Of Architectural Modernization
squer
1
420
Architecting for Scale
squer
0
190
Platform Engineering: It's Not What You Think It Is
squer
0
210
Other Decks in Technology
See All in Technology
Oracle Cloud Infrastructure:2025年7月度サービス・アップデート
oracle4engineer
PRO
1
170
Claude CodeでKiroの仕様駆動開発を実現させるには...
gotalab555
3
990
いかにして命令の入れ替わりについて心配するのをやめ、メモリモデルを愛するようになったか(改)
nullpo_head
7
2.5k
JAWS AI/ML #30 AI コーディング IDE "Kiro" を触ってみよう
inariku
3
350
AI関数が早くなったので試してみよう
kumakura
0
250
LLMをツールからプラットフォームへ〜Ai Workforceの戦略〜 #BetAIDay
layerx
PRO
1
940
九州の人に知ってもらいたいGISスポット / gis spot in kyushu 2025
sakaik
0
130
薬屋のひとりごとにみるトラブルシューティング
tomokusaba
0
240
✨敗北解法コレクション✨〜Expertだった頃に足りなかった知識と技術〜
nanachi
1
670
LTに影響を受けてテンプレリポジトリを作った話
hol1kgmg
0
350
生成AIによるデータサイエンスの変革
taka_aki
0
2.9k
LLMでAI-OCR、実際どうなの? / llm_ai_ocr_layerx_bet_ai_day_lt
sbrf248
0
450
Featured
See All Featured
Fantastic passwords and where to find them - at NoRuKo
philnash
51
3.4k
The Psychology of Web Performance [Beyond Tellerrand 2023]
tammyeverts
49
3k
GitHub's CSS Performance
jonrohan
1031
460k
YesSQL, Process and Tooling at Scale
rocio
173
14k
Rebuilding a faster, lazier Slack
samanthasiow
83
9.1k
Helping Users Find Their Own Way: Creating Modern Search Experiences
danielanewman
29
2.8k
Sharpening the Axe: The Primacy of Toolmaking
bcantrill
44
2.4k
Build your cross-platform service in a week with App Engine
jlugia
231
18k
Java REST API Framework Comparison - PWX 2021
mraible
33
8.8k
Large-scale JavaScript Application Architecture
addyosmani
512
110k
Build The Right Thing And Hit Your Dates
maggiecrowley
37
2.8k
実際に使うSQLの書き方 徹底解説 / pgcon21j-tutorial
soudai
PRO
183
54k
Transcript
@duffleit MicroFrontends Vergangenheit, Gegenwart & Zukunft JAX 2021 Mainz /
Remote, Mai 2021
@duffleit @duffleit @duffleit
[email protected]
David Leitner Coding Architect
@duffleit
@duffleit Montag, 29.02.2016
@duffleit
@duffleit ~ 160 Views ~ 240 Models
@duffleit Transactions Overview Payment Creation Self Service Console hyperlink hyperlink
@duffleit MicroFrontends @ v0.0.1-alpha
@duffleit https://bluepnume.medium.com/less-is-more-reducing-thousands-of-paypal-buttons-into-a-single-iframe-using-xcomponent-d902d71d8875
@duffleit Transactions Overview Payment Creation Self Service Console iframe iframe
hyperlink hyperlink
@duffleit 2016 Hyperlink
@duffleit hyperlink
@duffleit 2016 Hyperlink Iframes ClientSide Integration > 50% of internet
trafic from phones ServerSide Integration
@duffleit Transactions Overview Payment Creation Self Service Console iframe hyperlink
hyperlink SelfService μService
@duffleit EdgeService Payment Creation fragment SelfService μService Payment Creation μService
@duffleit Server Side Includes or Edge Side Includes Project Mosaic
@duffleit
@duffleit 2016 Hyperlink Iframes ClientSide Integration ServerSide Integration Server Side
Includes
@duffleit Round Trips
@duffleit 2016 Hyperlink Iframes ClientSide Integration ServerSide Integration Server Side
Includes
@duffleit App Shell /create-payment template /overview template Payment μService Transactions
Overview Self Service Console Self Service μService Payment Creation Transactions μService request Self Service Console Payment Creation navigation navigation
@duffleit • Meta-Router • State Sharing • Authn/Authz
@duffleit App Shell Payment μService Transactions Overview Self Service Console
Self Service μService Payment Creation Transactions μService request /overview template /create-payment template Self Service Console Payment Creation navigation navigation
@duffleit
@duffleit
@duffleit App Shell Payment μService Transactions Overview Self Service Console
Self Service μService Payment Creation Transactions μService request /overview template /create-payment template Self Service Console Payment Creation navigation navigation Externals window.ng.core = @angular/core bundle
@duffleit 2016 Hyperlink Iframes ClientSide Integration ServerSide Integration Server Side
Includes meta-spa-router First Meaningful Paint!
@duffleit 0 sec 0.3 sec 0.5 sec 0.7 sec First
Meaningful Paint JS
@duffleit Progressive Enhancement
@duffleit 2016 Hyperlink Iframes ClientSide Integration ServerSide Integration Server Side
Includes meta-spa-router Progressive Enhancement ?
@duffleit App Shell Payment μService Transactions Overview Self Service Console
Self Service μService Payment Creation Transactions μService request /overview template /create-payment template Self Service Console Payment Creation navigation navigation
@duffleit 2016 Hyperlink Iframes ClientSide Integration ServerSide Integration Server Side
Includes meta-spa-router Progressive Enhancement
@duffleit Host - Container <App /> Client - Container <
Profile /> ProfileService <Profile />
@duffleit 2016 Hyperlink Iframes ClientSide Integration ServerSide Integration Server Side
Includes meta-spa-router
@duffleit David Leitner @ DevoxxUA 2018: Micro Frontends – a
strive for fully Verticalized Systems https://www.youtube.com/watch?v=oxVRG71rF3w
@duffleit 2016 Hyperlink Iframes ClientSide Integration ServerSide Integration Server Side
Includes meta-spa-router
@duffleit Aber auch wenn mit Module Federation vieles besser wird*,
oft ist ein Frontend Monolith für die gegebenen Anforderungen auch “cool genug”. 😎
@duffleit by: twitter.com/swardley
@duffleit David Leitner Coding Architect
[email protected]
All das Präsentiert und
vieles mehr:
@duffleit Let’s talk about MicroFrontends: David Leitner Coding Architect
[email protected]