Angular Revolution

Angular

Novedades v17

START

Gentleman Programming

Sexy,filántropo,buen tipo y humilde

Con de tuti aprendemos a programar desde la experiencia

EsModules

ViteJS

Velocidad + performance + facilidad

TODO CAMBIARÁ...

con la revolución

Se vienen cositas...

Y todas me gustan

Nuevo ng new

- Routing por default - Standalone - Guards y Resolvers funcionales por default

Builders

Angular

application

dev-server

• hay que tocar cositas para que funcione
• TIENE SSR

• Es el que ya tenemos
• soporta los tres builders
• usa VITEJS con el builders que usen esbuild de forma automática

Esbuild

Esbuild por default

Builders

Angular

browser

browser-esbuild

• soportado en v17
• se puede seguir usando

• compatible con webpack
• NO tiene SSR

Esbuild

Webpack

App builder

• esbuild
• vite para server de desarrollo
• Soporte integrado a SSR y SSG
• genera Módulos de ES
• default para nuevas apps aunque es opcional
• 67% mejora de build de prod

Cómo aplicar los builders?

Cómo aplicar los builders?

Control Flow

Al que amas...o ODIas

Syntaxis y semántica

a lo HTML

PUEDES crear

la tuya!

Qué se dieron cuenta los de Google ?

• syntax no muy intuitiva
• imports en los stand alone son muy tediosos
• trackBy no lo usa ni Dios y eso que tiene un gran impacto en la performance
• se podría mejorar el tipado
• se podría mejorar la performance en tiempo de ejecución

Nuevo control flow

Nuevo control flow

Nuevo control flow

Defer

Nuevo trucaso para performance

A la vieja usanza

14

A la vieja usanza

A la vieja usanza

A la vieja usanza

A la vieja usanza

Ahora

XapDeferredLoader -> @defer

SSR...

UN DRAMA !

• Angular universal
• Se duplica el build
• mas de 50 lineas para configurar
• requiere commonjs

Gracias app bundler !

:)

• Solución todo en uno
• facil de habilitar ssr o prerendering

SSR...

no más un DRAMA !

Ventajas

• Soporte para modulos es para ssr
• mejora el tamaño del bundle
• soporte para fetch nativo en httpClient

Cómo se usa ?

ng new --ssr

Muchas gracias !