Descubra alguns dos recursos interessantes que chegaram aos navegadores da Web estáveis e Beta em abril de 2023.
Versões estáveis do navegador
Em abril de 2023, o Firefox 112 e o Chrome 112 ficaram estáveis. Vamos dar uma conferida no que isso significa para a plataforma da Web.
O atributo inert
O Firefox 112 inclui o atributo global inert. Esse atributo diz ao navegador para ignorar o elemento, indicando conteúdo que não deve ser interativo. Ele:
- Impede que eventos
clicksejam disparados. - Impede que o elemento receba foco.
- Exclui o elemento e o conteúdo dele da árvore de acessibilidade.
Agora, esse atributo é interoperável nos três mecanismos.
A função de easing linear()
A função de easing linear() permite interpolação linear entre vários pontos. Isso permite animações mais complexas, como efeitos elásticos e saltar. Essa função está no Firefox 112.
Compatibilidade com navegadores
- 113
- 113
- 112
- 17,2
Aninhamento de CSS
O Chrome 112 adiciona suporte ao aninhamento de CSS, um recurso muito esperado por muitos desenvolvedores. Isso introduz um novo seletor de aninhamento >, usado para aninhar regras de estilo relacionadas, de uma forma familiar para os desenvolvedores que usaram pré-processadores:
.nesting {
color: hotpink;
> .is {
color: rebeccapurple;
> .awesome {
color: deeppink;
}
}
}
CSS animation-composition
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.
Novo modo headless
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.
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 o Firefox 113 e o Chrome 113, e a versão Beta do Safari 16.5 ainda está em andamento. 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 113 inclui as funções color(), lab(), lch(), oklab() e oklch(). Também estão incluídas a função color-mix() da CSS Color 5 e a propriedade forced-color-adjust.
O Firefox também inclui a sintaxe nth-child of <selector>, oferecendo um controle mais preciso dos elementos que você quer selecionar. Leia mais em Mais controle sobre as seleções de :nth-child() com a sintaxe S.
Para CSS, o Chrome 113 inclui os recursos de mídia overflow-inline, overflow-block e update. Também incluído na função de easing linear() e no tipo image-set() sem prefixo.
O Chrome 113 também inclui a WebGPU, a sucessora das APIs gráficas WebGL e WebGL 2 para a Web. Ele oferece recursos modernos, como computação com GPU, acesso com menor sobrecarga ao hardware da GPU, capacidade de renderização em várias telas a partir de um único dispositivo gráfico e desempenho melhor e mais previsível.
Parte da série para iniciantes na Web