Descubre algunas de las interesantes funciones que se incorporaron a los navegadores web estables y beta durante mayo de 2023.
Versiones del navegador estable
En mayo de 2023, Firefox 113, Chrome 113, Chrome 114 y Safari 16.5 se volvieron estables. Veamos qué significa esto para la plataforma web.
WebGPU
Chrome 113 incluye WebGPU, el sucesor de las APIs de gráficos de WebGL y WebGL 2 para la Web. Proporciona funciones modernas como el procesamiento con GPU, menor sobrecarga de acceso al hardware de GPU, la capacidad de renderizar varios lienzos desde un solo dispositivo gráfico y un rendimiento mejor y más predecible.
Conjuntos propios
Los conjuntos propios (FPS) forman parte de Privacy Sandbox. Es una forma en que las organizaciones pueden declarar relaciones entre sitios, de modo que los navegadores puedan decidir cuándo permitir un acceso limitado a cookies de terceros para los sitios de un conjunto. FPS inició un lanzamiento en etapas en Chrome 113.
Funciones multimedia de CSS y mucho más
En el caso de CSS, Chrome 113 incluye las funciones multimedia overflow-inline y overflow-block.
Y la función multimedia update.
También se incluye la función de aceleración linear(), sobre la que puedes obtener más información en el artículo Cómo crear curvas de animación complejas en CSS con la función de aceleración linear().
Navegadores compatibles
- 113
- 113
- 112
- 17.2
Funciones de nivel 4 de color de CSS
Firefox 113 incluye las notaciones funcionales color(), lab(), lch(), oklab(), oklch() y color-mix(), junto con la propiedad de ajuste de color forzado. Esto significa que los nuevos espacios de color y funciones ahora son compatibles con los tres motores principales. Puedes obtener más información sobre estos espacios de color y funciones en la Guía de colores de CSS en alta definición.
Más control sobre las selecciones de :nth-child()
Firefox 113 también agrega la capacidad de pasar una lista de selectores a :nth-child() y nth-last-child(). Obtén más información al respecto y consulta ejemplos en la publicación Más control sobre las selecciones :nth-child() con la sintaxis de S.
Navegadores compatibles
- 111
- 111
- 113
- 9
API de Compressions Streams
La API de Compressions Streams, ahora compatible con los tres motores principales debido a la inclusión en Firefox 113, habilita la compresión y la descompresión de transmisiones. Esto significa que las aplicaciones de JavaScript ya no necesitan empaquetar una biblioteca de compresión.
Anidación de CSS
En la mayoría de los casos, Safari 16.5 resuelve los problemas, pero también agrega compatibilidad con el anidamiento de CSS, con el nuevo selector de anidamiento >, que se utiliza para anidar reglas de estilo relacionadas de una manera familiar para los desarrolladores que usan preprocesadores:
.nesting {
color: hotpink;
> .is {
color: rebeccapurple;
> .awesome {
color: deeppink;
}
}
}
Equilibrio entre los títulos y las text-wrap: balance
A partir de Chrome 114, puedes usar text-wrap: balance. Esto te permite equilibrar los títulos, lo que evita el problema de tener una sola palabra en la línea final y proporciona un resultado más agradable y legible. Para obtener más información, consulta Ajuste de texto de CSS: saldo.
CHIPS: Cookies con estado particionado independiente
Como parte del trabajo para eliminar de forma gradual las cookies de terceros, CHIPS permite habilitar la partición de cookies de terceros en sitios de nivel superior con el nuevo atributo de cookies Partitioned. CHIPS está disponible en Chrome 114.
La API de Popover
Además, en Chrome 114 se encuentra la API de Popover, que facilita la compilación de elementos de interfaz de usuario (IU) transitorios que se muestran sobre todas las demás IU de aplicaciones 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.
Obtenga más información en Introducción a la API de popover.
Versiones del navegador Beta
Las versiones de navegador beta te ofrecen una vista previa de los elementos que estarán disponibles en la próxima versión estable del navegador. Es un buen momento para probar nuevas funciones, o eliminaciones, que podrían afectar a tu sitio antes de que el mundo la implemente. Las nuevas versiones beta son Firefox 114, Chrome 115 y Safari 16.6. Estos lanzamientos aportan muchas funciones increíbles a la plataforma. Consulta las notas de la versión para obtener todos los detalles. Estos son solo algunos aspectos destacados.
Chrome 115 incluye varios valores para la propiedad display del CSS. Esto significa que display: flex se convierte en display: block flex y display: block se convierte en display: block flow. Los valores únicos se mantienen como palabras clave heredadas y, una vez que están en la versión estable de Chrome, los múltiples valores están disponibles en todos los motores.
Además, en Chrome 115 están las extensiones ScrollTimeline y ViewTimeline de la especificación de Animaciones web. Habilitan las animaciones basadas en desplazamientos a través de CSS y JavaScript.
Firefox 114 incluye la API de WebTransport, una actualización moderna de WebSockets que proporciona compatibilidad con varias transmisiones, transmisiones unidireccionales y entregas desordenadas.
Parte de la serie de novedades en la Web