Publicado em: 2 de março de 2026
Esta é a edição de janeiro de 2026 do resumo da Baseline. Todos os meses, destacamos os recursos da plataforma da Web que alcançaram novos marcos no Valor de referência, ajudando você a entender quais ferramentas estão prontas para uso nos seus projetos hoje.
Janeiro foi um começo de ano incrível, com várias APIs e unidades CSS importantes entrando na categoria "Recém-disponibilizadas", além de uma grande melhoria de layout que passou a estar "Amplamente disponível".
Recursos de referência "Novamente disponíveis"
Os seguintes recursos da Web se tornaram recém-disponíveis no Baseline em janeiro de 2026.
Transição do Active View
A
pseudoclasse CSS :active-view-transition
agora está disponível na versão Baseline Newly. Esse seletor permite que os desenvolvedores segmentem e
estilizem o elemento raiz de um documento especificamente enquanto uma transição de visualização está em
andamento. Isso é útil para aplicar estilos ou ajustes globais
que só devem existir durante o período de transição, como mudar a
cor de fundo da sobreposição de transição ou ajustar o z-index de camadas
específicas para garantir um fluxo visual suave.
Módulos JavaScript em service workers
Os service workers agora oferecem suporte a módulos JavaScript
em todos os principais mecanismos de navegador. Ao definir a opção type: 'module' ao chamar navigator.serviceWorker.register(), você pode usar instruções import e export padrão no script do service worker. Isso alinha os service
workers com as práticas modernas de desenvolvimento em JavaScript, permitindo uma
melhor organização do código, um gerenciamento de dependências mais fácil e a capacidade de compartilhar
código entre a linha de execução principal e o worker em segundo plano.
Navigation API
A API Navigation
oferece uma alternativa moderna e criada para fins específicos à API History legada, projetada especificamente para as necessidades de aplicativos de página única (SPAs, na sigla em inglês). Ele
oferece uma maneira centralizada de iniciar, interceptar e gerenciar todos os tipos de
ações de navegação, incluindo aquelas acionadas pelos botões "Voltar" e "Avançar"
do navegador. Com eventos como Maps, os desenvolvedores podem implementar um roteamento
do lado do cliente mais suave com menos código boilerplate. Para saber mais sobre como isso muda a
maneira como criamos para a Web, confira nossa postagem dedicada no blog: Roteamento moderno do lado do cliente: a API Navigation.
Unidade CSS rcap
A unidade rcap
é uma unidade de comprimento relativa à fonte raiz igual à "altura da caixa alta" (a altura
nominal das letras maiúsculas) da fonte do elemento raiz. Isso permite layouts tipográficos precisos que são dimensionados em relação ao tipo de letra principal usado no site, e não apenas ao tamanho da fonte.
Unidade CSS rch
Semelhante à unidade ch, mas relativa ao elemento raiz, a unidade rch representa a largura, ou mais especificamente, a medida de avanço do glifo "0" (zero) na fonte do elemento raiz. É ideal para criar layouts que dependem da largura dos caracteres, como um contêiner que precisa se ajustar precisamente a um número específico de caracteres na fonte raiz.
Unidade CSS rex
A unidade rex é a versão relativa à raiz de ex, igual à altura x da fonte do elemento raiz. Essa unidade é particularmente útil para elementos de alinhamento vertical e dimensionamento em relação à altura das letras minúsculas na tipografia principal do documento.
Unidade CSS ric
A unidade ric é
a contraparte relativa à raiz da unidade ic. É igual à medida de avanço "ideográfica" (normalmente a largura ou altura de um ideograma CJK) da fonte do elemento raiz. Essa é uma ferramenta vital para desenvolvedores que criam layouts internacionalizados, principalmente aqueles que usam scripts em chinês, japonês ou coreano.
Recursos de referência amplamente disponíveis
Os seguintes recursos da Web ficaram disponíveis para todos em janeiro de 2026.
Propriedade CSS display de dois valores
A
sintaxe de várias palavras-chave para a propriedade display
agora está disponível para todos os usuários. Com essa atualização, é possível definir explicitamente os tipos de exibição "externo" e "interno" de uma caixa. Por exemplo, em vez do
pré-composto inline-flex, você pode usar display: inline flex. Isso esclarece se um elemento participa do fluxo de bloco ou inline (o tipo externo) e como os filhos dele são dispostos (o tipo interno, como flex ou grid). Essa mudança torna o mecanismo de layout CSS mais lógico e consistente para os desenvolvedores.
A propriedade CSS animation-composition
A propriedade animation-composition
define como várias animações devem interagir quando afetam a mesma
propriedade simultaneamente. Você pode escolher entre replace, add ou accumulate, o que oferece controle preciso sobre como animações complexas e em camadas são calculadas.
Matriz por cópia
O JavaScript agora inclui
métodos que permitem transformar matrizes
sem alterar os dados originais. Métodos como toReversed(), toSorted() e toSpliced() retornam uma cópia nova e modificada da matriz, promovendo um estilo de programação mais funcional e seguro.
Ajude o YouTube a melhorar
Como sempre, avise se esquecemos de algo relacionado ao Baseline. Vamos incluir na próxima edição. Se você tiver dúvidas ou quiser enviar feedback sobre o Baseline, informe um problema no nosso Issue Tracker.