Ruta de movimiento de CSS, API de NotRestoredReason en la memoria caché atrás/adelante, pantalla en pantalla de documentos y mucho más.
A menos que se indique lo contrario, los cambios descritos se aplican a la versión más reciente del canal beta de Chrome para Android, ChromeOS, Linux, macOS y Windows. Obtén más información sobre las funciones mencionadas aquí a través de los vínculos proporcionados o en la lista de ChromeStatus.com. Chrome 116 está en versión beta a partir del 19 de julio de 2023. Puedes descargar la versión más reciente en Google.com para computadoras de escritorio o en Google Play Store para Android.
CSS
Esta versión agrega dos funciones nuevas de CSS.
Ruta de movimiento de CSS
Las rutas de movimiento permiten que los autores posicionen cualquier objeto gráfico y lo animen a lo largo de una ruta especificada por el desarrollador. Esto permite varias posibilidades de transformación nuevas y potentes, como el posicionamiento mediante coordenadas polares (con la función ray()) en lugar de las coordenadas rectangulares estándar que usa la función translate() o la animación de un elemento a lo largo de una ruta definida. Esto facilita la definición de transiciones espaciales 2D complejas y atractivas. Una ruta se puede especificar como circle(), ellipse(), rect(), inset(), xywh(), polygon(), ray() y url().
Animaciones de visualización de contenido y visualización
Chrome 116 admite las propiedades display y content-visibility en las animaciones de fotogramas clave. Esta compatibilidad permite a los desarrolladores crear animaciones de salida después de las cuales el elemento se convierte automáticamente en display: none o content-visibility: hidden sin necesidad de escribir JavaScript para controlar ese cambio una vez que finaliza la animación. Esto permite animaciones de salida para que los elementos se agreguen solo en CSS.
APIs web
AbortSignal.any()
Muestra una señal que se anula cuando se anula cualquiera de los indicadores de origen. Los desarrolladores pueden usar esto para combinar fuentes de anulación independientes, por ejemplo, tiempos de espera especificados con AbortSignal.timeout() y señales asociadas con un AbortController, y pasarlos a APIs asíncronas, como fetch().
Compatibilidad con BYOB para la recuperación
La implementación de Chrome de ReadableStream admite lectores del tipo “trae tu propio búfer” (BYOB) para flujos de bytes legibles. Ahora, Response.body también es un flujo de bytes legible en lugar de un flujo legible "predeterminado". Esto permite que la API de recuperación se use con lectores de “trae tu propia botella”, lo que reduce la sobrecarga y las copias de recolección de elementos no utilizados, y mejora la capacidad de respuesta para los usuarios. Blob.stream() ahora también se beneficia de esta optimización.
API de NotRestoredReason para la memoria caché atrás/adelante
La API de NotRestoredReason informará la lista de motivos por los que no se entrega una página desde BFcache en una estructura de árbol de marcos, a través de la API de PerformanceNavigationTiming.
Pantalla en pantalla del documento
Pantalla en pantalla del documento agrega una nueva API para abrir una ventana siempre visible que se puede propagar con HTMLElements arbitrarios. Esta es una expansión de la API de HTMLVideoElement existente que solo permite que un HTMLVideoElement se coloque en una ventana de pantalla en pantalla (PIP). Esto permite a los desarrolladores web ofrecer una mejor experiencia de PIP a los usuarios.
Comodines expandidos en los orígenes de la política de permisos
Los comodines de subdominio incluidos en las listas de entidades permitidas ofrecían una flexibilidad valiosa, pero eran diferentes de los analizadores de comodines existentes y requerían tareas nuevas de código y especificaciones. Este intent reducirá esa sobrecarga reutilizando partes de la especificación existente de la Política de Seguridad del Contenido y permitirá que scheme + wildcard domain y wildcard port se incluyan en la lista de entidades permitidas. Específicamente, este intent adoptaría la definición de fuente del host y de la fuente del esquema en lugar del origen en la definición de la lista de entidades permitidas y, al mismo tiempo, requeriría que la parte de la ruta de acceso esté vacía (ya que las Políticas de Permisos se aplican a los orígenes coincidentes).
Paquete de FedCM: API de Login Hint, API de User Info y API de RP Context
Esta actualización incluida en el paquete permite personalizaciones para los flujos de acceso federados que usan la API de Federated Credential Management (FedCM).
Con la API de Login Hint, el usuario de confianza (RP) puede especificar una sugerencia sobre la cuenta de usuario que quiere que se muestre en la IU de FedCM. Esto se utiliza principalmente para proporcionar una mejor UX a los usuarios recurrentes.
La API de User Info permite que el proveedor de identidad (IdP) recupere la información del usuario a fin de personalizar la experiencia de acceso de los usuarios recurrentes, por ejemplo, mediante botones personalizados "Acceder con IdP".
Con la API de RP Context, el RP puede solicitar que el título "Acceder" del diálogo de FedCM reemplace el título "Acceder" por "Registrarse", "Usar" o "Continuar", con el fin de alinear el intent real para el usuario.
Eventos de entrada y salida del mouse y el puntero no compuestos
Haz que la propiedad event.composed en los eventos mouseenter, mouseleave, pointerenter y pointerleave "false" cumpla con las especificaciones y corrige las brechas de interoperabilidad. Tanto la especificación de eventos de IU para eventos del mouse como la de eventos del puntero definen estos eventos como no compuestos. Ambas especificaciones cambiaron de sus definiciones originales hace algunos años: https://github.com/w3c/uievents/pull/210 https://github.com/w3c/pointerevents/pull/461. Además de abordar la brecha de interoperabilidad, este cambio también corrige un envío erróneo o triple de estos eventos a un host de shadow DOM en Chromium cuando el shadow DOM también escucha.
Quita la herencia de la zona de pruebas de document.open
Actualmente, las marcas de zona de pruebas del llamador se aplican al destinatario cuando document.open se orienta a una ventana diferente. Después de este cambio, esto ya no será así.
Informar un reinicio crítico del canal en NavigationTiming
Los sitios web pueden indicar que una sugerencia de cliente específica es fundamental para la página si la incluye en un encabezado de respuesta HTTP Critical-CH. De esta manera, se activará un reinicio de la conexión si la sugerencia que se indica en el encabezado de respuesta HTTP Critical-CH podría incluirse (pero no se incluyó) en la solicitud HTTP enviada inicialmente. Este intent propone agregar readonly attribute DOMHighResTimeStamp criticalCHRestart; a la interfaz PerformanceNavigationTiming.
Pruebas de origen en curso
En Chrome 116, puedes habilitar las siguientes pruebas de origen nuevas.
COOP: restringir-propiedades
La política de abridor de origen cruzado se usa para cortar la relación entre las ventanas emergentes y los activadores, y así aumentar la seguridad. “restrict-properties” es un valor propuesto que restringe la relación en lugar de dividirla por completo. Habilitaría crossOriginIsolated cuando se vinculara con COEP.
Regístrate en la prueba de orígenes de restricción de propiedades COOP.
API de estado de acceso de FedCM
La API de estado de acceso de IdP de la API de Federated Credential Management (FedCM) permite que un proveedor de identidad (IdP) le indique al navegador cuándo sus usuarios acceden o salen para que FedCM pueda mejorar sus propiedades de privacidad optimizando su UX.
Regístrate para la prueba de origen del estado de acceso de FedCM
API de EditContext
La API de EditContext simplifica el proceso de integración de una app web con métodos de entrada de texto avanzados, como la escritura de formas VK, los paneles de escritura a mano, el reconocimiento de voz y las composiciones de IME. La API mejora la accesibilidad y el rendimiento, y ofrece nuevas funciones para editores basados en la Web.
Regístrate en la prueba de origen de la API de EditContext
Tiempo de fotogramas de animación largos
Esta es una extensión de las tareas largas. Mide la tarea junto con la actualización de renderización posterior y agrega información como las secuencias de comandos de larga duración, el tiempo de renderización y el tiempo dedicado al diseño y el estilo forzados, lo que se conoce como paginación excesiva de diseños.
Los desarrolladores pueden usar esto como diagnóstico de “lentitud”, que se mide con el INP, cuando encuentran las causas de la congestión del hilo principal, que suele ser la causa del INP deficiente.
Regístrate para la prueba de origen de Long Animation Frame Timing