Primeira vez na plataforma da Web em abril

Descubra alguns dos recursos interessantes que foram lançados em navegadores da Web estáveis e Beta em abril de 2023.

Rachel Andrew

Versões estáveis do navegador

Em abril de 2023, o Firefox 112 e o Chrome 112 passaram a ser estáveis. Vamos conferir o que isso significa para a plataforma da Web.

O atributo inert

O Firefox 112 inclui o atributo global inert. Esse atributo instrui o navegador a ignorar o elemento, indicando que o conteúdo não deve ser interativo. Ele:

  • Evita que os eventos click sejam acionados.
  • Impede que o elemento ganhe foco.
  • Exclui o elemento e o conteúdo dele da árvore de acessibilidade.

Esse atributo agora é interoperável nos três mecanismos.

Compatibilidade com navegadores

  • Chrome: 102.
  • Edge: 102.
  • Firefox: 112.
  • Safari: 15.5.

Origem

A função de transição linear()

A função de suavização linear() permite a interpolação linear entre vários pontos. Isso permite animações mais complexas, como efeitos de elasticidade e rebote. Essa função está no Firefox 112.

Compatibilidade com navegadores

  • Chrome: 113.
  • Edge: 113.
  • Firefox: 112.
  • Safari: 17.2.

Anilhamento de CSS

O Chrome 112 adiciona suporte ao aninhamento de CSS, um recurso muito aguardado por muitos desenvolvedores. Isso introduz um novo seletor de aninhamento >, usado para aninhar regras de estilo relacionadas, de uma forma que será familiar para desenvolvedores que usaram pré-processadores:

.nesting {
  color: hotpink;

  > .is {
    color: rebeccapurple;

    > .awesome {
      color: deeppink;
    }
  }
}

Compatibilidade com navegadores

  • Chrome: 120.
  • Borda: 120.
  • Firefox: 117.
  • Safari: 17.2.

Origem

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 de animação.

Compatibilidade com navegadores

  • Chrome: 112.
  • Edge: 112.
  • Firefox: 115.
  • Safari: 16.

Origem

Novo modo headless

Se você usa o modo headless do Chrome, por exemplo, com o Puppeteer, a versão 112 traz um modo headless totalmente novo. Saiba mais em O modo headless do Chrome está sendo atualizado.

Versões Beta do navegador

As versões Beta do navegador oferecem uma prévia dos recursos que vão estar na próxima versão estável do navegador. É um ótimo momento para testar novos recursos ou exclusões que possam afetar seu site antes que o mundo receba a versão. 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. Confira alguns destaques abaixo.

O Firefox 113 inclui as funções color(), lab(), lch(), oklab() e oklch(). Também está incluída a função color-mix() do CSS Color 5 e a propriedade forced-color-adjust.

O Firefox também inclui a sintaxe nth-child of <selector>, que permite controlar melhor quais elementos você quer selecionar. Leia mais em Mais controle sobre as seleções :nth-child() com a sintaxe de 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 suavização 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 de GPU, menor sobrecarga de acesso ao hardware de GPU, capacidade de renderização em várias telas de um único dispositivo gráfico e desempenho melhor e mais previsível.

Parte da série Novidades da Web