Descubra alguns dos recursos interessantes que chegaram aos navegadores da Web estáveis e Beta em março de 2023.
Versões estáveis do navegador
Em março de 2023, o Firefox 111, o Chrome 111 e o Safari 16.4 se tornaram estáveis. Vamos dar uma conferida no que isso significa para a plataforma da Web.
Atributos HTML globais
O Firefox 111 adiciona suporte a alguns atributos HTML globais úteis. O atributo autocapitalize controla se o texto pode ser maiúscula automaticamente quando o usuário digita em um teclado virtual.
O atributo translate indica se um elemento precisa ser traduzido quando uma página é localizada.
Sistema de arquivos particulares de origem (OPFS, na sigla em inglês)
Agora o Firefox é compatível com o 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), gerando snapshots de visualizações e permitindo que o DOM mude sem sobreposição de estados.
Saiba mais na postagem de lançamento As transições de visualização do SPA chegam ao Chrome 111.
Novos espaços e funções de cor CSS
O Chrome 111 também conta com novas maneiras de usar cores na Web. O Chrome agora é compatível com espaços de cores que acessam cores fora da gama RGB, além das funções color() e color-mix(). Saiba mais no nosso Guia de cores CSS de alta definição e na postagem do blog sobre color-mix() (links em inglês).
A versão do Chrome também inclui novo DevTools para ajudar você a trabalhar com essa nova funcionalidade de cores.
Mais controle sobre :nth-child() seleções
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 do Chrome 111 estão as Ações de apresentação de slides para a API de sessão de mídia: "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 da Web. Este artigo não abrange todas as adições, então confira a lista completa de recursos nas notas da versão do Safari 16.4.
Há várias outras pseudoclasses de CSS com suporte nesta versão: :user-invalid, :user-valid, :dir(), :modal e :fullscreen.
Nova sintaxe de intervalo para consultas de mídia
Esta 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 é enviada no Chrome.
Propriedades e valores de CSS
O Safari 16.4 adiciona suporte para @property, permitindo o registro de propriedade personalizada do CSS diretamente em uma folha de estilo. Saiba mais sobre isso em @property: como conceder superpoderes às variáveis CSS.
Suporte à API CSS
As excelentes adições para CSS continuam a surgir, com suporte para OM tipado por CSS. Essa API expõe valores CSS como objetos JavaScript digitados em vez de strings. Ele facilita o trabalho com CSS a partir de JavaScript e tem um desempenho melhor do que os métodos existentes.
Também há suporte a folhas de estilo construtáveis com CSSStyleSheet(). Isso permite o compartilhamento de folhas de estilo entre um documento e suas subárvores do shadow DOM. Com esta versão do Safari, folhas de estilo construtíveis agora são compatíveis com todos os três mecanismos.
Push na Web e API Badging
O Safari agora oferece suporte para push na Web e com a API Badging, uma ótima notícia para desenvolvedores de apps. Essa versão oferece suporte a notificações push em todos os principais mecanismos.
Importar mapas
Outra adição que traz um recurso para o status interoperável é a adição de Importar mapas do JavaScript, facilitando a importação de módulos ES.
Compatibilidade com navegadores
- 89
- 89
- 108
- 16.4
Versões Beta do navegador
As versões Beta do navegador oferecem uma prévia do que vai aparecer na próxima versão estável. Este é um ótimo momento para testar novos recursos ou remoções que podem afetar seu site antes que o mundo receba esse lançamento. As novas versões Beta são Firefox 112, Safari 16.5 e Chrome 112. Essas versões trazem muitos recursos excelentes para a plataforma. Confira as notas da versão para saber todos os detalhes. Aqui estão apenas 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 inert em Introdução ao inert. O Firefox também vai ativar o suporte para a função de easing linear().
O Chrome 112 e o Safari 16.5 adicionam suporte ao aninhamento de CSS, um recurso muito esperado por muitos 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 devem ser compostos com a composição da animação.
Se você usar o modo Headless do Chrome, por exemplo, com o Puppeteer, o 112 traz um novo modo Headless. Saiba mais no upgrade do modo headless do Chrome.
Parte da série para iniciantes na Web