New in Chrome hero logo

Nuevo en Chrome 114

Published on

Translated to: English

Esto es lo que necesitas saber:

  • CSS [text-wrap: balance] (#text-wrap-balance) está disponible para mejorar los diseños de texto.
  • Las cookies divididas por sitio de nivel superior (CHIPS) están aquí.
  • Los popovers son más fáciles que nunca con el nuevo Popover API.
  • Y hay mucho más.

Yo soy Adriana Jara. Profundicemos y veamos qué hay de nuevo para los desarrolladores en Chrome 114.

text-wrap: balance.

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

Pruebe una demostración

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

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

El bloque de texto equilibrado es más agradable a la vista de un lector ya que llama mejor la atención y, en general, es más fácil de leer.

Equilibrar los titulares será y debería ser el principal caso de uso para text-wrap: balance . Ya que hay un costo de rendimiento para equilibrar el texto, entonces para mitigar el costo solo funciona para un máximo de cuatro líneas.

Consulte este artículo con ejemplos y más detalles para mejorar sus diseños de texto.

CHIPS: Cookies con estado particionado independiente.

CHIPS (cookies con estado particionado independiente, por sus siglas en inglés), permite optar por cookies de terceros particionados por el sitio de nivel superior utilizando el nuevo atributo de cookie Partitioned.

Antes de CHIPS, cuando un usuario visitaba el sitio A, el sitio C incrustado podía establecer una cookie en la máquina del usuario. Si el usuario luego visita el sitio B que también incrusta el sitio C, el sitio C podría acceder a la misma cookie que se configuró en el sitio A. Esto permite que el sitio C recopile la actividad de navegación de un usuario en el sitio A, B y cada sitio en el que está incrustado.

Diagrama con sitios y storage sin particionar.

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

Con CHIPS, cuando un usuario visita el sitio A y el contenido incrustado del sitio C establece una cookie con el atributo Partitioned, la cookie se guarda en un contenedor particionado solo para las cookies que establece el sitio C cuando está incrustado en el sitio A. El navegador solo enviaría esa cookie cuando el sitio de nivel superior es A.

Diagrama mostrando sitios y almacenamiento particionado

Cuando el usuario visita un nuevo sitio, por ejemplo, el sitio B, el sitio C no recibiría la cookie que se configuró cuando C se incrustó en el sitio A.

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

Popover API.

Con Popover API es más fácil crear elementos de interfaz de usuario (UI) transitorios que se muestran encima de todas las demás UI de aplicaciones web.

Estos incluyen elementos interactivos para el usuario como menús de acción, sugerencias de elementos de formulario, selectores de contenido y IU de enseñanza.

El nuevo atributo popover permite mostrar cualquier elemento en la capa superior automáticamente. Esto significa que el desarrollador ya no tiene que preocuparse por el posicionamiento, el apilamiento de elementos, el enfoque o las interacciones del teclado.

Esto es similar al elemento <dialog>, pero tiene varias diferencias importantes, incluido el comportamiento de fácil descarte, gestión de interacción popover y soporte de eventos, y la falta de un modo "modal".

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

¡Y más!

Por supuesto que hay mucho más.

*Devtools le permite pausar y depurar código C y C++ en aplicaciones WebAssembly con compatibilidad con DWARF. *La opción exclusionFilters en navigator.bluetooth.requestDevice() permite a los desarrolladores web excluir algunos dispositivos del selector del navegador..

Otras lecturas

Esto cubre solo algunos aspectos destacados clave. Compruebe los enlaces a continuación para cambios adicionales en Chrome 114.

Suscríbete

Para mantenerse actualizado, suscríbase al canal de YouTube para desarrolladores de Chrome, y recibirás una notificación por correo electrónico cada vez que lancemos un nuevo video.

Yo soy Adriana Jara, y tan pronto como se lance Chrome 114, estaré aquí para contarles qué hay de nuevo en Chrome.

Published on Improve article

Atrás

How the game editor Construct 3 uses the File System Access API to let users save their games

Siguiente

What's New in DevTools (Chrome 115)

This site uses cookies to deliver and enhance the quality of its services and to analyze traffic. If you agree, cookies are also used to serve advertising and to personalize the content and advertisements that you see. Learn more about our use of cookies.