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
Angular_Elements.pdf
Search
Mariano Alvarez
July 13, 2019
0
84
Angular_Elements.pdf
Mariano Alvarez
July 13, 2019
Tweet
Share
More Decks by Mariano Alvarez
See All by Mariano Alvarez
Vainilla Redux
mahcr
0
33
Web Workers
mahcr
0
25
PWA: Web app con super poderes
mahcr
0
47
Redux - NgRx v8
mahcr
0
72
AMP ¿Como iniciar?
mahcr
0
37
Volando_con_el_Assistant.pdf
mahcr
0
110
Intro to Angular
mahcr
2
23
Angular Elements
mahcr
0
38
The beauty of NgRx
mahcr
0
43
Featured
See All Featured
Build The Right Thing And Hit Your Dates
maggiecrowley
24
2k
Designing Dashboards & Data Visualisations in Web Apps
destraynor
226
51k
KATA
mclloyd
15
12k
Dealing with People You Can't Stand - Big Design 2015
cassininazir
357
22k
[Rails World 2023 - Day 1 Closing Keynote] - The Magic of Rails
eileencodes
2
1.3k
The Power of CSS Pseudo Elements
geoffreycrofte
60
5k
Optimizing for Happiness
mojombo
370
69k
Sharpening the Axe: The Primacy of Toolmaking
bcantrill
17
1.4k
Visualizing Your Data: Incorporating Mongo into Loggly Infrastructure
mongodb
34
8.9k
[RailsConf 2023 Opening Keynote] The Magic of Rails
eileencodes
9
8.3k
Building Applications with DynamoDB
mza
88
5.6k
The World Runs on Bad Software
bkeepers
PRO
61
6.7k
Transcript
Angular Elements Reutilización de componentes con
@malvarezcr ¿Quién soy? Web Practice Lead Co-Organizador de Angular Costa
Rica Fan de JS, TS, NG, Web Techs, Pizza, Emojis Mariano Álvarez
@malvarezcr GitHub https://github.com/mahcr/angular-elements
Conceptos
@malvarezcr ¿Qué es Angular?
@malvarezcr ¿Qué es Angular?
@malvarezcr ¿Qué son Web Components? Basado en: • Template Elements
• Shadow DOM • JS Modules • Custom Elements
@malvarezcr ¿Qué son Web Components?
@malvarezcr ¿Qué son Web Components?
@malvarezcr ¿Qué son Web Components?
None
@malvarezcr Pero, ¿Qué es Angular Elements?
None
@malvarezcr ¿Qué es Angular Elements?
@malvarezcr ¿Qué es Angular Elements?
@malvarezcr ¿Qué es Angular Elements?
@malvarezcr ¿Qué es Angular Elements?
@malvarezcr ¿Qué es Angular Elements? • Uso en otros frameworks
• Micro Front-Ends • Uso de syntaxis de Angular PROS • Server side / Content apps • Versionamiento / Deployment • Soportado por los browsers excepto por …….
@malvarezcr ¿Qué es Angular Elements? • Uso de polyfills •
Se generan 3 archivos • Tamaño del bundle CONS Ivy
@malvarezcr ¿Qué es Angular Elements? • Uso de polyfills -
Differential Loading • Se generan 3 archivos - Ngx-build-plus • Tamaño del bundle - Pendiente Soluciones Ivy
@malvarezcr ¿Qué es Angular Elements? Differential Loading
@malvarezcr ¿Qué es Angular Elements? • Uso de polyfills -
Differential Loading • Se generan 3 archivos - Ngx-build-plus • Tamaño del bundle - Pendiente Soluciones Ivy
@malvarezcr ¿Qué es Angular Elements? NGX-build-plus
@malvarezcr ¿Qué es Angular Elements? NGX-build-plus ng build --prod --single-bundle
ngx-build-plus
@malvarezcr ¿Qué es Angular Elements? • Uso de polyfills -
Differential Loading • Se generan 3 archivos - Ngx-build-plus • Tamaño del bundle - Pendiente Soluciones Ivy
Futuro
Demo
⚡Conclusión
Angular Costa Rica • Facebook, YouTube, Medium @angularcostarica • Twitter
@angularcr