Está en vivo y en directo la gente de Angular anunciando todas las cositas nuevas de Angular 19
Pero no os preocupéis porque no os habéis perdido nada, ya os lo cuento yo
La primera gran noticia es que Standalone va a ser por defecto
Ya sabéis, la forma más sencilla de crear vuestros componentes y tener que escribir todo el boilerplate
Y además, fijaos que ya es por defecto, ya no vais a tener que poner Standalone True
Sino que esta va a ser la forma por defecto
Ahora también ha anunciado, los Signals llegan para ser estables
Tanto los Signals como los valores computados son estables
Se han pasado Signal y Computed totalmente a Estable
Así que la nueva forma de tener Inputs, los modelos, Output, ViewChild, ViewChildren, ContentChild, ContentChildren
Todo esto, estas nuevas APIs estables en Angular 19
Y van a crear, y ahora están anunciando, nuevas APIs, nuevas y experimentales
Y aquí que tenemos, bueno pues fijaos, vamos a tener señales que van a estar Signals enlazadas
Donde vamos a tener un enlace con un Signal y otro para que podamos enlazarlo
Esto ya me parece bastante interesante
Ya está, no sé, ah, Resources, hostia, Resources también
Esto lo que te va a permitir es trabajar con valores asíncronos
Que entiendo que por debajo va a estar utilizando de alguna forma también los Signals
Tendríamos, sería algo, ostras, esto es muy interesante
Esto va a ser algo muy parecido a lo que sería pues React Query, ¿vale?
Esto sería algo muy parecido a React Query
Donde vamos a tener una ID para identificarlo y tal
Oye, pues una nueva API para trabajar con, obviamente, datos asíncronos
Donde podéis recuperar el valor, el estado en el que se encuentra
Vale, vale, pues interesante
Y a ver, alguna cosita más
Nuevas herramientas de refactoring en Angular 19
Esto me imagino que será para migrar automáticamente el código entre versiones
Porque es verdad que es un rollazo, es un rollazo
Y esto, tengo que decir que siempre me ha gustado y siempre he creído
Que ha estado increíble como lo ha hecho la gente de NextGS y React en concreto
Pero la gente de NextGS, el tema de las migraciones ha sido siempre increíble
El hecho de tener un code mod y que te haga, te pase a la nueva versión de, yo que sé
De los hooks, el quitarte alguna dependencia y tal
Eso siempre ha sido increíble
Y es una cosa que siempre le ha faltado a ese nivel de Angular
Y fijaos ahora, ahora tenéis, para hacer la migración a las signals, a los inputs
La nueva forma de tratar los inputs en Angular
Pues mira, para hacer la migración, también para las queries con signals
Para el output, madre, muy bien, eh
Eso ya hacía falta, eh
Ya hacía falta, así que buenas noticias por el equipo de Angular
Dice, bueno, y que podéis aprender más en angular.dev
Y parece ser que esto, estas son las novedades
De Angular 19, entiendo que harán pues un blog post
Donde veremos todas las novedades
Este sí que tiene pinta, este sí que tiene pinta
18 minutos de artículo
Os voy a decir una cosa, eh
Y esto lo voy a decir en serio
Minko Getschev, desde que tomó las riendas de Angular 19
Bueno, de Angular 19 no, de Angular
Muy bien Angular
Está evolucionando muchísimo
Los últimos dos años, espectacular, eh
Espectacular
Mira, eh, algunas de las cosas más destacadas
Developer preview de, hostia, soporte para hidratación incremental
Para mejorar mucho el rendimiento en un montón de casos de uso
Claro, ostras, esto sería algo parecido, que no exactamente igual
A lo que haría, hostia, no acuerdo, Quick
Hostia, hidratación incremental
Esto es una cosa que no tiene React y lo necesita como el comer
Controlar qué rutas se renderizan el cliente en el servidor
O durante la build para resolver por los parámetros de la ruta
Durante el prerenderizado
Esto es algo que hace algo parecido también a Astro
Schematics que para actualizar, para tener las mejores prácticas
Inputs, outputs, queries, inyección de dependencias
Y un nuevo sistema de build
Se ha estabilizado los primitivos de reactividad
Los signals y el computed y el input y todo esto
Y se ha introducido linked signal y resource
Y un montón de mejoras
Más de 200, 2000, un montón de feature requests
Con más de 2.700 pulgares para arriba
Que pues tiene el time picker component
El eliminar los imports y tal
Que han mejorado temas de velocidad
Vale, han mejorado temas de rendimiento
Y esto es esto
Esto tiene muy buena pinta
Welcome incremental hydration
No entiendo por qué esto no lo hace React todavía
Es que no lo puedo entender
Bueno, pues aquí lo que podéis ver
Es que hasta que tú no clicas en el componente
Que vas a utilizar
Entonces no ejecuta el javascript
Que necesita en el cliente
Y claro, esto lo que hace es que
Toda tu página
¿Veis que todo es gris?
Digamos que lo que es gris
Digamos que es como estático
Como que todavía no ha ejecutado
El javascript que necesita para funcionar
Pero cuando haces click
Entonces es como que evalúa el javascript
Que necesita para entender el evento
Esto en javascript
O sea, en React no es así
Lo que pasa en React
Cuando tú cargas y entras en una página
Es que de repente
Todo se tiene que evaluar
Todo el javascript se evalúa
Para inicializar todos los eventos de la página
Con los React Server Components
La idea era intentar arreglar esto
Pero no lo arregla del todo
Y esto está muy bien
Porque te lo está haciendo
Pues automágicamente
¿Sabes?
Así que muy, muy bien
Fijaos
Dice
El componente que está en gris
Muestra que Angular
No lo ha cargado
Y no lo ha hidratado
¿Vale?
Hidratarlo sería como darle vida a ese componente
Angular
Empieza a descargar el componente
De la red
Cuando el componente
Cuando el componente empieza como a
Hacer este
Cuando empieza como
¿Veis que hace ese parpadeo?
Eso es que se lo descarga
¿Qué es lo malo que tiene esto?
Esto tiene algo malo
Y lo malo es que
Puede notar el cliente
El usuario
Una latencia
Porque haces click
Y cuando hace click
Se descarga
Esa parte del componente
Y encima evalúa el JavaScript
Y esto puede tener
Un pequeño
Es como un lazy load
Y puede tener un pequeño coste
Pero puede valer mucho la pena
¿Vale?
Yo me imagino
No sé si es al click
O al hacer hover
Yo me imagino que será al hacer hover
Pero claro
En mobile es imposible
Al hacer hover
Porque no puedes detectar
Cuando hace hover
Puede ser que lo hayan hecho
Al hacer hover
O puede ser incluso
Creo que si utilizas el defer
Amigo
Amigo
Claro
Aquí lo tenemos
Si utilizamos la sintaxis
Del defer de Angular
Me imagino que tú
Serás la persona
Que vas
Vas a elegir
Cuando es
Por ejemplo
Con el defer
Podrías hacer
Cuando está en el viewport
Cuando haces click
Puedes hacer diferentes
O sea
No estás obligado
A que sea en una cosa en concreto
De hecho
Aquí lo
¿Ves?
Hidratar
Cuando encuentran el viewport
Y entiendo
Que habrá
Diferentes maneras
Será el del viewport
Pero también tienes
Cuando está en idle
En interacción
Cuando hace interacción
Al hacer hover
De forma inmediata
O sea
Hay diferentes
No solo
Interacción sería hacer click
Y al hacer hover
También estaría
Pero claro
Al hacer hover
Pensad que en mobile
No funciona
Pero bueno
Que se puede personalizar
Tiene buena pinta
Tiene buena pinta
Se le está poniendo
Buena cara a Angular
Serves a rendering
Serves a rendering
Con soundless Angular
Están quitando
SoundJS
Vale
Oye pues
Tiene buena pinta
Y bueno
Tiene muy buena pinta
Esto
El tema de las migraciones
Para utilizar
Las nuevas APIs
Sin tener
Tú que reescribirlo
Y tal
Oye pues
Muy bien
Fijaos la de cambios
Madre mía
Angular
Es que está trabajando
Fijaos la diferencia
Lo digo
Sin actitud
De verdad
A mí me encanta
Me encanta React
La velocidad de desarrollo
Porque React
Estamos con la release candidate
Desde abril
De 2024
Que es verdad
Oye que tiene muchos cambios
Y tiene muy buena pinta
Los cambios
De React
Pero
La cadencia de cambios
De Angular
Tío
Es que es espectacular
O sea
Es increíble
La de cambios
También es verdad
Que se la tienen que jugar más
Seguramente
Que tienen que ir un poquito
A vamos a intentar cosas
Para llamar la atención
Y tal
Puede ser
Pero oye
Q2
Al equipo de Angular
Y si eres desarrollador de Angular
Me alegro mucho por ti
Porque se le está poniendo
Bastante buena cara
A Angular
O sea
No os lo digo en broma
Para nada
Os lo digo totalmente en serio
De que creo que
Tiene bastante buena pinta
Todas las cosas
Que están haciendo
El equipo de Angular
Y mira
Ahora justamente
Están explicando
El tema de la hidratación
Fijaos
Angular 16
Es lo que está pasando
Ahora mismo en React
Que es toda la aplicación
Se hidrata
Esto significa
Que toda la aplicación
Nada más entrar
Pues tiene que evaluar
Todo el JavaScript
Para funcionar
En Angular 17
Ya tuvimos al menos
El Defer
¿Vale?
El Defer lo que te permitía
Es decir
Bueno esta parte
Solo quiero que la cargues
Pero claro
Ahora es poder hacer
Hidratación incremental
Es que me parece
Me parece tremendo
Porque pensad que
Lo malo
¿Qué significa la hidratación?
La hidratación significa
Que hasta que no descargas
JavaScript
Y lo evalúas
Tu aplicación no funciona
El poder hacer una hidratación
Incremental
Permite que la aplicación
Pueda funcionar
Y que se haya cargado
Completamente
Y solo aquellas partes
Que sean importantes
Evalúes el JavaScript
Pero claro
En lugar de
Traerte todo el JavaScript
Lo que estás haciendo
Es traerte solo
Aquel JavaScript
Que necesitas
O sea
Tremendo
Muy buena pinta
Muy buena pinta
Las cosas como son
O sea se le está poniendo
Muy buena cara
A Angular
Las cosas como son
Me alegro mucho
Por Angular
Está haciendo cositas
Bien
Y estas cosas
Se agradecen
Porque cuanta más competencia
Haya
Y mejores ideas
Y que se la puedan copiar
Unos de otros
Pues mejor que mejor
Midu
Yo por un trabajo aparte
Me estoy comenzando con Angular
Pero ya tengo mucho tiempo
Trabajando con React
Es una tecnología
Que quiero tener en mi stack
¿Cuál?
React o Angular
A ver yo creo que
O sea
Si sabes
Si aprendes React
Y aprendes Angular
Es que es perfecto
O sea
Es el binomio perfecto
Es lo que te da
La máxima amplitud
En el mundo del desarrollo web
Con JavaScript
Son los dos frameworks
Bibliotecas más usadas
De lejos
Parece que es perfecto
¿Desde ahora empezarás a hacer
Tus proyectos en Angular?
No
La verdad es que no
No te voy a engañar
Me alegro mucho por Angular
Perfecto
Pero llevo muchos años
De experiencia en React
Y no tendría mucho sentido
Crear mis proyectos con Angular
Y de hecho
Sigue siendo
Mi tecnología favorita
O sea
Soy capaz
De ver
Las ventajas
Y las cosas
Que están haciendo bien
Pero eso no significa que yo de repente
Ahora me voy a convertir
De hecho
Muchos de mis proyectos
Se irán siendo astro
Porque es que creo que tiene
Todo el sentido del mundo
Y bueno
Que algún día pueda hacer
Alguno con Angular
Eso sí que no te voy a decir
Que no
Eso sí que no te lo voy a negar
Podría ser
Pero aún así
Me sigue gustando
Bastante más React
O sea
Veo más cerca
Vue
En mi punto de vista
Que me gusta más
En mi estilo
Que no Angular
O sea que
Pero a nivel laboral
A ver
Es que las cosas son así
Todos saben que el único amor de Midu
Es PHP
Sí ¿no?
A ver
Las cosas son así
Amigos
Yo creo que
Muchas veces
Sobre todo
Hay que saber diferenciar
Lo que a uno le gusta
Con lo que
El mercado requiere
O la mejor opción
En un equipo de trabajo
Aunque no sea lo que a ti te gusta
Y yo sé que en el mercado
La mejor opción a día de hoy
Es React
Y la segunda
Bastante cerca
Sería Angular
Y esto puede cambiar
Según el país
Según la ciudad
Según mil cosas
En general
Es así a día de hoy
Te puede gustar React
Lo puedes odiar
Pero esto es así
Ahora
A mí
De que me guste más
Me gusta bastante React
Y me gusta
Lo más cercano que veo
Es Vue
Porque a mí me gusta
El libertinaje
Y Angular
Ese tipo de libertinaje
No lo tiene
Pero entiendo
Que Angular
Para muchas empresas
Puede tener bastante sentido
O sea
No lo veo mal
Y en muchos equipos
Puede tener sentido
Y lo veo así
O sea lo veo así
Pero eso no significa nada
No significa que yo sea imbécil
Y sea incapaz
De ver las ventajas
Que tiene Angular
O las buenas cosas
Que están haciendo últimamente
Soy poliamoroso
En el mundo de la programación
Y los videojuegos
Soy poliamoroso
Vamos
A tope
Sin ningún tipo de dudas
Gracias por ver el videojuegos