Novedades de Chrome 137

Rachel Andrew

Fecha de publicación: 27 de mayo de 2025

Chrome 137 se está lanzando ahora, y en esta publicación, se comparten algunas de las funciones clave de la versión. Lee las notas de la versión 137 de Chrome completas.

Novedades de esta versión:

Usa reading-flow y reading-order para garantizar un orden lógico de las pestañas a través de diseños complejos. La función if() de CSS proporciona una forma concisa de expresar valores condicionales. La integración de promesas de JavaScript (JSPI) permite que las aplicaciones de WebAssembly se integren con promesas de JavaScript.

reading-flow y reading-order de CSS

La propiedad CSS reading-flow controla el orden en que los elementos de un diseño flex, de cuadrícula o de bloque se exponen a las herramientas de accesibilidad y cómo se enfocan mediante métodos de navegación secuencial lineal. Esto resuelve un problema de larga data con los diseños de cuadrícula y flex, en los que el orden de tabulación puede desconectarse del orden en que se organizan los elementos.

Toma un valor de palabra clave, con un valor predeterminado de normal, que mantiene el comportamiento de ordenar elementos en orden DOM. Para usarlo dentro de un contenedor de flex, establece su valor en flex-visual o flex-flow. Para usarlo dentro de un contenedor de cuadrícula, configura su valor en grid-rows, grid-columns o grid-order.

La propiedad CSS reading-order te permite anular manualmente el orden de los elementos dentro de un contenedor de flujo de lectura. Para usar esta propiedad dentro de una cuadrícula, un contenedor flex o de bloque, establece el valor reading-flow del contenedor en source-order y establece el reading-order del elemento individual en un valor entero.

Para obtener más información, consulta Cómo usar reading-flow de CSS para la navegación de enfoque secuencial lógica.

Función if() de CSS

La función if() de CSS proporciona una forma concisa de expresar valores condicionales. Acepta una serie de pares condición-valor, delimitados por punto y coma. La función evalúa cada condición de forma secuencial y muestra el valor asociado con la primera condición verdadera. Si ninguna de las condiciones se evalúa como verdadera, la función muestra un flujo de tokens vacío.

div {
  color: var(--color);
  background-color: if(style(--color: white): black; else: white);
}

.dark {
  --color: black;
}

.light {
  --color: white;
}

<div class="dark">dark</div>
<div class="light">light</div>

Integración de promesas de JavaScript de WebAssembly (JSPI)

La integración de promesas de JavaScript (JSPI) es una API que permite que las aplicaciones de WebAssembly se integren con promesas de JavaScript.

Permite que un programa de WebAssembly actúe como generador de una promesa y que el programa de WebAssembly interactúe con APIs que contienen promesas.

En particular, cuando una aplicación usa JSPI para llamar a una API que genera promesas (JavaScript), se suspende el código de WebAssembly y se le otorga al llamador original del programa de WebAssembly una promesa que se cumplirá cuando el programa de WebAssembly finalmente se complete.

Y mucho más

Por supuesto, hay mucho más:

  • Como continuación de Storage Partitioning, Chrome implementó la partición del acceso a la URL de BLOB por clave de almacenamiento.
  • Ahora se implementan los formatos de píxeles de punto flotante de Canvas.
  • Se admite offset-path: shape() para que puedas usar formas responsivas y establecer la ruta de animación.

Lecturas adicionales

Esto solo abarca algunos aspectos clave. Consulta los siguientes vínculos para ver cambios adicionales en Chrome 137.

Suscribirse

Para mantenerte al tanto, suscríbete al canal de YouTube de Chrome Developers y recibirás una notificación por correo electrónico cada vez que lancemos un video nuevo. También puedes seguirnos en X o LinkedIn para ver artículos y entradas de blog nuevos.

En cuanto se lance Chrome 138, estaremos aquí para contarte las novedades.