Novedades de Chrome 114

Tenga en cuenta lo siguiente:

  • text-wrap: balance CSS está disponible para mejorar los diseños de texto.
  • Estas son las cookies particionadas por sitio de nivel superior (CHIPS).
  • Los elementos emergentes son más fáciles que nunca con la API de Popover.
  • Además, hay mucho más.

Soy Adriana Jara. Analicémoslas y veamos las novedades para desarrolladores en Chrome 114.

text-wrap:balance.

Usa text-wrap: balance para mejorar los diseños de texto. La siguiente animación muestra la diferencia que puedes hacer con esta línea.

Probar una demostración

Como desarrollador, no conoces el tamaño final, el tamaño de la fuente o incluso el idioma del texto. Todas las variables son necesarias para un tratamiento eficaz del ajuste de texto. Como el navegador sí conoce todos los factores, con text-wrap:balance puedes solicitar que el navegador descubra la mejor solución para ajustar líneas equilibradas.

Los dos ejemplos anteriores se muestran juntos, uno está marcado como desequilibrado y el otro como equilibrado.

El bloque de texto equilibrado es más agradable para los lectores. Capta mejor la atención y, en general, es más fácil de leer.

El equilibrio de títulos será y debería ser el caso de uso principal de text-wrap: balance. Existe un costo de rendimiento para equilibrar el texto, de modo que, para mitigar el costo, solo funciona para un máximo de cuatro líneas.

Consulta este artículo que contiene ejemplos y más detalles para mejorar tus diseños de texto.

CHIPS: Cookies con estado particionado independiente.

CHIPS (Cookies con estado particionado independiente), permite habilitar las cookies de terceros que se particionan por sitios de nivel superior mediante el nuevo atributo de cookies Partitioned.

Antes de CHIPS, cuando un usuario visita el sitio A, el sitio C incorporado podía establecer una cookie en la máquina del usuario. Luego, si el usuario visita el sitio B, que también incorpora el sitio C, el sitio C podría acceder a la misma cookie que se estableció en el sitio A. Esto permite que el sitio C recopile la actividad de navegación del usuario en los sitios A y B, y en todos los sitios en los que está incorporado.

Diagrama que muestra sitios y almacenamiento con cookies no particionadas.

Si bien el seguimiento entre sitios es un problema, hay necesidades válidas de cookies entre sitios que se pueden lograr de una manera que preserve la privacidad con la partición de cookies.

Con CHIPS, cuando un usuario visita el sitio A y el contenido incorporado del sitio C establece una cookie con el atributo Particionada, la cookie se guarda en un archivo jar particionado solo para las cookies que el sitio C establece cuando está incorporado en el sitio A. El navegador solo enviará esa cookie cuando el sitio de nivel superior sea A.

Diagrama en el que se muestran sitios y almacenamiento compartido con cookies.

Cuando el usuario visita un sitio nuevo, por ejemplo, el sitio B, no recibirá la cookie que se estableció cuando C estaba incorporado en el sitio A.

Consulta este artículo para obtener más información sobre el proceso para eliminar gradualmente las cookies de terceros.

La API de Popover

Con la API de Popover, es más fácil compilar elementos de interfaz de usuario (IU) transitorios que se muestran sobre todas las demás IU de apps web.

Estas incluyen elementos interactivos para los usuarios, como menús de acciones, sugerencias de elementos de formulario, IU de enseñanza y selectores de contenido.

El nuevo atributo de ventana emergente permite que cualquier elemento se muestre automáticamente en la capa superior. Esto significa que el desarrollador ya no tiene que preocuparse por el posicionamiento, la pila de elementos, el enfoque ni las interacciones del teclado.

Esto es similar al elemento <dialog>, pero tiene varias diferencias importantes, como el comportamiento de descartar la luz, la administración de interacción de ventanas emergentes, la compatibilidad con eventos y la falta de un modo "modal".

Consulta este artículo para obtener más información.

Y mucho más.

Por supuesto que hay mucho más.

  • Herramientas para desarrolladores te permite pausar y depurar código C y C++ en apps de WebAssembly que admiten DWARF.
  • La opción exclusionFilters en navigator.bluetooth.requestDevice() permite a los desarrolladores web excluir algunos dispositivos del selector de navegadores.
  • Hay una prueba de origen para Desenfoque del fondo.

Lecturas adicionales

Esto abarca solo algunos aspectos destacados. Consulta los vínculos a continuación para ver cambios adicionales en Chrome 114.

Suscribirse

Para mantenerte al día, suscríbete al canal de YouTube de Chrome Developers. Recibirás una notificación por correo electrónico cada vez que lancemos un video nuevo.

Soy Adriana Jara y, apenas se lance Chrome 115, estaré aquí para contarte las novedades de Chrome.