Descubra alguns dos recursos interessantes que chegaram aos navegadores da Web Stable e Beta em março de 2023.
Lançamentos de navegadores estáveis
Em março de 2023, o Firefox 111, o Chrome 111 e o Safari 16.4 estão estáveis. Vamos analisar o que isso significa para a plataforma da Web.
Atributos HTML globais
O Firefox 111 adiciona suporte para alguns atributos HTML globais úteis. O atributo autocapitalize controla se o texto pode começar a usar letras maiúsculas automaticamente quando o usuário digitar em um teclado virtual.
O atributo translate indica se um elemento precisa ser traduzido quando uma página for localizada.
Sistema de arquivos particulares de origem (OPFS, na sigla em inglês)
O Firefox adiciona suporte ao Sistema de arquivos particulares de origem (OPFS, na sigla em inglês) ao usar a API File System Access. Saiba mais sobre o OPFS.
A API View Transitions
O Chrome 111 adiciona a API View Transitions, simplificando a criação de transições refinadas em apps de página única (SPAs), capturando snapshots de visualizações e permitindo que o DOM mude sem qualquer sobreposição entre estados.
Saiba mais na postagem de lançamento As transições de visualização de SPA vão chegar no Chrome 111.
Novos espaços de cor e funções CSS
O Chrome 111 também tem um novo conjunto de maneiras de usar cores na Web. O Chrome agora oferece suporte a espaços de cor que acessam cores fora da gama RGB, junto com as funções color() e color-mix(). Saiba mais no Guia de cores do CSS de alta definição e na postagem do blog color-mix() (em inglês).
A versão do Chrome também inclui o novo DevTools para ajudar você a trabalhar com essa nova funcionalidade de cores.
Mais controle sobre as seleções do :nth-child()
O Chrome 111 adiciona a capacidade de transmitir uma lista de seletores para :nth-child() e nth-last-child(). Saiba mais sobre isso e veja exemplos na postagem Mais controle sobre as seleções de :nth-child() com a sintaxe S.
Compatibilidade com navegadores
- 111
- 111
- 113
- 9
Suporte para o slide anterior e o próximo na API Media Session
Por fim, nesta lista de adições ao Chrome 111 estão as Ações de apresentação de slides para a API Media Session — "previousslide" e "nextslide".
Compatibilidade com navegadores
- 111
- 111
- x
- x
Suporte a pseudoclasse no Safari
O Safari 16.4 é uma versão incrível para a plataforma web. Este artigo não abrange todas as adições. Confira a lista completa de recursos nas notas da versão do Safari 16.4.
Há várias pseudoclasses CSS com suporte nesta versão: :user-invalid, :user-valid, :dir(), :modal e :fullscreen.
Nova sintaxe de intervalo para consultas de mídia
Essa versão do Safari torna a sintaxe de intervalo muito mais elegante e útil para consultas de mídia interoperável em todos os três mecanismos. Confira exemplos dessa sintaxe nesta postagem, publicada quando a sintaxe foi disponibilizada no Chrome.
Propriedades e valores CSS
O Safari 16.4 adiciona suporte ao @property, permitindo o registro de propriedade personalizada do CSS diretamente em uma folha de estilo. Saiba mais sobre isso em @property: como dar superpoderes às variáveis CSS.
Suporte à API CSS
Grandes novidades no CSS continuam a surgir, com suporte para CSS Typed OM. Essa API expõe valores CSS como objetos JavaScript tipados em vez de strings. Ele facilita o trabalho com CSS a partir de JavaScript e tem melhor desempenho do que os métodos existentes.
Também há suporte para folhas de estilo construíveis com CSSStyleSheet(). Isso permite o compartilhamento de folhas de estilo entre um documento e as subárvores do shadow DOM. Com esta versão do Safari, as folhas de estilo construíveis agora são compatíveis com os três mecanismos.
Web Push e API Badging
O Safari agora é compatível com o Web Push, além da API de selo, que é uma ótima notícia para desenvolvedores de apps. Em particular, essa versão significa que as notificações push são compatíveis com todos os principais mecanismos.
Importar mapas
Outra adição que torna um recurso interoperável é a adição de Importar mapas em JavaScript, facilitando a importação de módulos ES.
Compatibilidade com navegadores
- 89
- 89
- 108
- 16.4
Versões do navegador Beta
As versões Beta oferecem uma prévia do que será incluído na próxima versão estável do navegador. Esse é um ótimo momento para testar novos recursos, ou remoções, que podem afetar seu site antes do lançamento oficial. As novas versões Beta são Firefox 112, Safari 16.5 e Chrome 112. Esses lançamentos trazem muitos recursos excelentes para a plataforma. Confira as notas da versão para saber todos os detalhes, incluindo alguns destaques.
O Firefox 112 adiciona suporte para o atributo inert, o que tornará esse atributo útil disponível em todos os mecanismos. Saiba mais sobre inerte em Introdução à função inerte. O Firefox também ativará o suporte para a função de easing linear().
O Chrome 112 e o Safari 16.5 têm suporte à aninhamento de CSS, um recurso muito esperado por vários desenvolvedores.
O Chrome 112 também inclui suporte para animation-composition. Saiba como essa propriedade funciona em Especificar como vários efeitos de animação precisam ser compostos com animação e composição.
Se você usar o modo headless do Chrome, por exemplo, com o Puppeteer, o 112 terá um modo headless totalmente novo. Saiba mais no upgrade do modo headless do Chrome.
Parte da série na Web do Google