Upgrade to Pro — share decks privately, control downloads, hide ads and more …

Workshop: Angular Elements @AngularInDepth 2019...

Avatar for Manfred Steyer Manfred Steyer PRO
June 15, 2019
Programming
280
0

Workshop: Angular Elements @AngularInDepth 2019, Kiev

Avatar for Manfred Steyer

Manfred Steyer PRO

June 15, 2019

More Decks by Manfred Steyer

See All by Manfred Steyer
Generative UI & AI-Assistants for Your Angular Solutions
Avatar for Manfred Steyer manfredsteyer
PRO
1
370
Generative UI & AI-Assistants for Your Angular Solutions
Avatar for Manfred Steyer manfredsteyer
PRO
0
170
Nostalgia Meets Technology: Super Mario with TypeScript
Avatar for Manfred Steyer manfredsteyer
PRO
0
250
Signal Forms: Details & Live Coding @enterJS 2026 in Mannheim
Avatar for Manfred Steyer manfredsteyer
PRO
0
270
Strategic Design in the Frontend: Moduliths & Micro Frontends @DDDEurope
Avatar for Manfred Steyer manfredsteyer
PRO
0
190
Agentic UI
Avatar for Manfred Steyer manfredsteyer
PRO
0
280
Signal Forms: Beyond the Basics @ngBaguette 2026 in Paris
Avatar for Manfred Steyer manfredsteyer
PRO
0
320
Agentic UI beyond Chats Architecture Patterns & Open Standards @ngMunich 05/2026
Avatar for Manfred Steyer manfredsteyer
PRO
0
270
Agentic AI in the Frontend: Architectures with Open Standards @iJS London 2026
Avatar for Manfred Steyer manfredsteyer
PRO
0
200

Other Decks in Programming

See All in Programming
数百円から始めるRuby電子工作
Avatar for Tarosa tarosay
0
160
自動化したのに回らないテスト運用の壁ーAI時代の品質責任と生産性
Avatar for Masahiko Funaki(舟木 将彦) mfunaki
1
140
源内ハンズオン概要編
Avatar for Hideyuki Nagata hideg
0
190
KotlinConf Extended South Korea 2026 Keynote
Avatar for HyunWoo Lee l2hyunwoo
0
110
Claude Code全社展開のためにやったことn選～プラグイン302個・コミッター271人を支えるために～
Avatar for Kenichi Takahashi kenchan
5
1.6k
バグを直したら useEffect が消えた
Avatar for taki colorful12
3
620
jsmini JavaScript Engine を作ってみた話
Avatar for Yosuke Furukawa yosuke_furukawa
PRO
0
330
Google Apps Script で Ruby を動かす
Avatar for Shogo Kawahara kawahara
0
270
リアルな遅延を測る仕様
Avatar for kota-yata kota_yata
1
120
S3 を使うアプリケーションをローカル完結で動かすことに全力を注いでみた / Running S3 Apps Offline
Avatar for Daisuke Garaike contour_gara
0
530
楽しそうなつよつよエンジニアと目が死んでる僕/A brilliant engineer having a blast, and dead-eyed me.
Avatar for Ryusei Ohkura 3l4l5
2
190
プロポーザルを書いてもらう
Avatar for pvcresin pvcresin
0
560

Featured

See All Featured
Lessons Learnt from Crawling 1000+ Websites
Avatar for Charles Meaden charlesmeaden
PRO
1
1.5k
Design in an AI World
Avatar for tapps tapps
1
280
Building Flexible Design Systems
Avatar for Yesenia Perez-Cruz yeseniaperezcruz
330
40k
A better future with KSS
Avatar for Kyle Neath kneath
240
18k
Between Models and Reality
Avatar for mayunak mayunak
4
390
Being A Developer After 40
Avatar for Adrian Kosmaczewski akosma
91
590k
Collaborative Software Design: How to facilitate domain modelling decisions
Avatar for Kenny Baas-Schwegler baasie
1
280
Dominate Local Search Results - an insider guide to GBP, reviews, and Local SEO
Avatar for Greg Gifford greggifford
PRO
0
300
The browser strikes back
Avatar for Jono Alderson jonoalderson
0
1.5k
Color Theory Basics | Prateek | Gurzu
Avatar for Gurzu gurzu
0
430
CSS Pre-Processors: Stylus, Less & Sass
Avatar for Bermon Painter bermonpainter
360
30k
Learning to Love Humans: Emotional Interface Design
Avatar for Aarron Walter aarron
275
41k

Transcript

  1. @ManfredSteyer Workshop: A Deep Look into Angular Elements Manfred Steyer

    SOFTWAREarchitekt.at ManfredSteyer

  2. @ManfredSteyer ✓ Commodore 64 ✓ 1982 ✓ ~ 1 MHz

    ✓ 64 KB RAM ✓ Disks with 170 KB

  3. @ManfredSteyer Version with two cores ;-) Challenge: Resources!

  4. @ManfredSteyer Long Time Maintain- ability Maintain + Extend for 10

    +/- yrs

  5. @ManfredSteyer There are milk products lasting longer than some JavaScript

    frameworks

  6. @ManfredSteyer Web Components

  7. @ManfredSteyer Contents • Web Components 101 • Web Components with

    Angular Elements • Polyfills • Dynamically Adding Web Components • Loading External Web Components

  8. @ManfredSteyer About me… • Manfred Steyer • SOFTWAREarchitekt.at • Angular

    Trainings and Consultancy • Google Developer Expert (GDE) • Trusted Collaborator in the Angular Team Page ▪ 8 Manfred Steyer Public: Selected European Cities In-House: everywhere http://www.softwarearchitekt.at

  9. @ManfredSteyer Standards behind Web Components Templates Shadow DOM Custom Elements

    Omnipresent in Angular Baked-in: @Component(encapsulation: …) Angular Elements

  10. @ManfredSteyer DEMO

  11. @ManfredSteyer All this can be polyfilled down to IE11 (more

    or less)

  12. @ManfredSteyer Polyfill

  13. @ManfredSteyer Selected Polyfills loader • Custom Elemens • Shadow DOM

    es5-adapter • For browsers that DO support custom elements • Alternative: Differential Loading

  14. @ManfredSteyer DEMO

  15. @ManfredSteyer Labs https://www.softwarearchitekt.at/labs/AngularInDepth/

  16. @ManfredSteyer More on SOFTWAREarchitekt.at • Angular Elements, Part I to

    V • Web Components with Angular Ivy in 6 Steps

  17. @ManfredSteyer Summary Polyfills Custom_Element_Schema Angular Elements Shadow DOM Dynamically Adding

    Dynamically Loading

  18. @ManfredSteyer Contact and Downloads [mail] [email protected] [web] SOFTWAREarchitekt.at [twitter] ManfredSteyer

    d Blog about this stuff Public: Selected European Cities In-House: everywhere http://www.softwarearchitekt.at