Google I/O (Connect) — Recap de la categoría Web
Tags: web, angular, corewebvitals, baseline
Published: 2023-05-31 17:31:48


![Keynote Connect](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/q7m9jwujxkw1wf6nw6uq.png)

Son muchas las novedades que se mencionaron en el **Google I/O**, el 10 de mayo y en el evento de **Connect I/O** el 24 de mayo.

El **Google I/O**, es un evento donde se lanzan las novedades de los productos de **Google** y el **Connect**, es un nuevo evento, con un enfoque más técnico, orientado a los desarrolladores.


![I/O Connect registration](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/hu8yv76n8nt4ie8sw4d3.png)

El **Connect**, podemos decir que es un evento para aprender sobre desarrollo de algunas tecnologías, nos permite hacer networking, nos da la posibilidad de interactuar con algún Googler, nos permite conectar con líderes de comunidades y expertos de alguna categoría de Google y sobre todo divertirnos.


![GDG, GDE y WTM Latam](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/gwuadf518ewkb22n27x5.png)

El evento del Connect, separo su contenido en 4 categorías, en las que se hicieron énfasis en diferentes tecnologías.

Las categorías fueron **Inteligencia Artificial**, **Cloud**, **Móvil** y **Web**.


![Agenda](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/akoj0wh95x1rqcgvbzu0.png)

Como lo mencionaron en el Connect, estamos en la edad dorada de la Interfaz de usuario de la Web, nuevos cambios y nuevas herramientas se avecinan, y es super importante estar a la vanguardia con ellos y abordarlos, para que no nos agarren desprevenidos.

![Golden era](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/4t3g7etj7s1irlyzxc8t.jpg)

Google creo un playlist de las charlas del Google I/O de la Web, que puedes revisar cada una de las novedades: **[PlayList](https://www.youtube.com/playlist?list=PLOU2XLYxmsIJGxIV8Lt8gF_79Z334LQ6h)**.


[![Web Playlist](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/eeo3zu2j950n4auvzh51.png)](https://www.youtube.com/playlist?list=PLOU2XLYxmsIJGxIV8Lt8gF_79Z334LQ6h)

De los temas mas destacados podemos mencionar:

[Video - I/O 2023 Recap](https://youtu.be/gkAYHomO5Hg)

- Lo nuevo en la Web: **[Baseline](https://web.dev/baseline-features/)**, es la nueva herramienta que nos permitira ver la compatibilidad entre navegadores de alguna API, propiedad, característica o funcionalidad.

[Video - New in Web](https://youtu.be/x9rh0Du4Czg)

[Newly interoperable](https://web.dev/tags/newly-interoperable/)

[New to the web](https://web.dev/tags/new-to-the-web/)

[Interop 2023](https://wpt.fyi/interop-2023)

[Openwebdocs](https://openwebdocs.org/)

- Core Web Vitals + Interaction to Next Paint (INP), Core Web Vitals, se conoce por ser una iniciativa de Google, que nos brinda una guía de indicadores de calidad, para mejorar la experiencia de usuario en la web. El INP mide la capacidad de respuesta a lo largo de todas las interacciones de una página, y reemplazará al FID en marzo del 2024.

[Video - Top CWV opportunities](https://youtu.be/mdB-J6BRReo)

[INP - Interaction to Next paint](https://web.dev/inp/)

[Respond to input in 200ms](https://youtu.be/KZ1kxzsJZ5g)

- **[WebGPU — Unlocking modern GPU access in the browser](https://developer.chrome.com/blog/webgpu-io2023/)**. Mejora el rendimiento y el renderizado de los gráficos.

[Introducing Web GPU](https://youtu.be/m6T-Mq1BPXg)

- **[WebAssembly: A new development paradigm for the web](https://youtu.be/RcHER-3gFXI)**. **Wasm** se conoce por ser un formato binario que se compila a través de otros lenguajes para un mayor rendimiento, usado para funcionalidades donde **JavaScript** requiere de mucho mayor rendimiento. Muchas aplicaciones apostaron en la Web por la adopción de **Wasm**, pero algunas otras empezaron a implementarla.

[webassembly](https://webassembly.org/)

[Photoshop journey on the web](https://web.dev/ps-on-the-web/)

[Video - Web Assembly 2023](https://youtu.be/RcHER-3gFXI)

**Otros temas** importantes mencionados en el I/O:

Mejorar el debuging en **Chrome Dev tools**:

[Video - Reduce debugging friction](https://youtu.be/3lNkq264nkM)

- **[Passkeys](https://io.google/2023/program/0c9e010f-617a-426a-a4fb-bd1d19c91358/)**, como alternativa para los passwords

[Learn Passkeys](https://youtu.be/SF8ueIn2Nlc)

[Sign in with a passkey through form autofill](https://web.dev/passkey-form-autofill/)

[Create a Passkey for passwordless logins](https://web.dev/passkey-registration/)

[Sign in your user with Credential Manager - Android Developers](https://developer.android.com/training/sign-in/passkeys)

- Privacy Sandbox: **[FedCM](https://developer.chrome.com/blog/fedcm-shipping/)**, abstracción al caso de uso de flujos de identidad federada:

[Video - Getting started with Attribution Reporting](https://youtu.be/mYVi3yL-GNI)

- Lo nuevo en las animaciones Web

[Video - New in Chrome extensions](https://youtu.be/oDcb3fvtETs)

## Angular

Angular se encuentra en su como decimos algunos, la tercera era. En la version 16, fueron lanzadas muchas novedades de las que podemos destacar

[Angular v16 is here](https://blog.angular.io/angular-v16-is-here-4d7a28ec680d)

- **Signals**, que nos permite definir los valores reactivos y mencionar la dependencia que hay entre ellos.

[Getting started with Angular signals](https://youtu.be/EEzDLpIbW9w)

[Sub-RFC2](https://github.com/angular/angular/discussions/49683)

- Server-side rendering y hydration. Angular le apuesta al Server side con Angular universal, y en la versión 16, mejoraron el rendimiento, evitaron que la aplicación se re-renderice, entre otros beneficios como mejorar el Core Web Vitals en algunos escenarios.

[Whats next for server side rendering in angular](https://blog.angular.io/whats-next-for-server-side-rendering-in-angular-2a6f27662b67)

- **Vite + esbuild**. Una buena noticia para los desarrolladores es que ahora podemos crear una aplicación con Vite y podemos usar el esbuild en modo vista previa, para probar el rendimiento del build de nuestras aplicaciones.


De Angular estas son solo unas pocas de la gran lista de novedades que se lanzaron en la versión 16, algunas de ellas están en modo vista previa, para que podamos probarlas y empezar la integración de ellas, adelantándonos al lanzamiento de la versión 17.

## Conclusion

El **Google i/o** y el **Connect** son grandes eventos para compartirnos los avances en los productos y tecnologías. Especialmente el Connect, es un evento de que aporta mucho a los desarrolladores, permitiendo poder interactuar con los involucrados en los desarrollos de las tecnologías.

De estos nuevos lanzamientos podemos decir que serán de mucha utilidad, algunos harán cambios de paradigmas y nos aportaran demasiado en los diferentes desarrollos de nuestras aplicaciones, en especial que es el tema de este artículo en la Web.