Compartilhe

Resumo mensal da linha de base de janeiro de 2026 | Blogue | web.dev

Publicado: 2 de março de 2026

Bem-vindo à edição de janeiro de 2026 do resumo da linha de base. A cada mês, destacamos os recursos da plataforma web que alcançaram novos marcos no Baseline, ajudando você a entender quais ferramentas estão prontas para uso em seus projetos hoje.

Janeiro foi um início de ano emocionante, com diversas APIs e unidades CSS significativas passando para a categoria Recentemente disponível, juntamente com uma grande melhoria de layout tornando-se Amplamente disponível.

Recursos básicos recentemente disponíveis

Os seguintes recursos da web tornaram-se Baseline recentemente disponíveis em janeiro de 2026.

Transição de visualização ativa

O
:active-view-transition Pseudoclasse CSS
agora está disponível a linha de base recentemente. Este seletor permite que os desenvolvedores direcionem e estilizem o elemento raiz de um documento especificamente enquanto uma transição de visualização está em andamento. Isto é particularmente útil para aplicar estilos globais ou ajustes que só deveriam existir durante o período de transição, como alterar a cor de fundo da sobreposição de transição ou ajustar o índice z de camadas específicas para garantir um fluxo visual suave.

Módulos JavaScript em service workers

Service Workers agora oferecem suporte a módulos JavaScript
em todos os principais mecanismos de navegador. Ao definir o type: 'module' opção ao ligar navigator.serviceWorker.register()você pode usar o padrão import e
export instruções dentro do seu script de service worker. Isso alinha os service workers com as práticas modernas de desenvolvimento de JavaScript, permitindo uma melhor organização do código, um gerenciamento mais fácil de dependências e a capacidade de compartilhar código entre o thread principal e o trabalhador em segundo plano.

A API de navegação
fornece uma alternativa moderna e desenvolvida especificamente para a API de histórico herdada, projetada especificamente para as necessidades de aplicativos de página única (SPAs). 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 Mapsos desenvolvedores podem implementar um roteamento mais suave no lado do cliente com menos código clichê. Para saber mais sobre como isso muda a forma como construímos para a web, confira nossa postagem de blog dedicada: Roteamento moderno do lado do cliente: a API de navegação.

rcap Unidade CSS

O rcap unidade
é uma unidade de comprimento relativo à fonte raiz igual à “altura da tampa” (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, em vez de apenas ao tamanho da fonte.

rch Unidade CSS

Semelhante ao ch unidade, mas em relação ao elemento raiz, o
rch unidade
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 deve caber com precisão em um número específico de caracteres na fonte raiz.

rex Unidade CSS

O rex unidade
é a versão relativa à raiz de exigual à altura x da fonte do elemento raiz. Esta unidade é particularmente útil para alinhamento vertical e dimensionamento de elementos em relação à altura das letras minúsculas na tipografia principal do seu documento.

ric Unidade CSS

O ric unidade é a contraparte relativa à raiz do ic unidade. É igual à medida de avanço “ideográfica” (normalmente a largura ou altura de um ideograma CJK) da fonte do elemento raiz. Esta é uma ferramenta vital para desenvolvedores que criam layouts internacionalizados, especialmente aqueles que usam scripts chineses, japoneses ou coreanos.

Recursos amplamente disponíveis de linha de base

Os seguintes recursos da web tornaram-se amplamente disponíveis na linha de base em janeiro de 2026.

CSS de dois valores display propriedade

O
sintaxe de múltiplas palavras-chave para o display propriedade
agora está amplamente disponível na linha de base. Esta atualização permite definir explicitamente os tipos de exibição “externo” e “interno” de uma caixa. Por exemplo, em vez do pré-composto inline-flexvocê pode usar display: inline flex. Isso esclarece se um elemento participa do fluxo em bloco ou inline (o tipo externo) e como seus filhos 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.

O animation-composition Propriedade CSS

O animation-composition propriedade
define como múltiplas animações devem interagir quando afetam a mesma propriedade simultaneamente. Você pode escolher entre replace, addou
accumulateproporcionando controle preciso sobre como as animações complexas em camadas são calculadas.

Matriz por cópia

JavaScript agora inclui
métodos que permitem transformar arrays
sem alterar os dados originais. Métodos como toReversed(), toSorted()e toSpliced() retornar uma cópia nova e modificada do array, promovendo um estilo de programação mais funcional e seguro.

Ajude-nos a melhorar

Como sempre, informe-nos se perdemos algo relacionado ao Baseline e garantiremos que isso seja capturado em uma edição futura! Se você tiver alguma dúvida ou quiser fornecer feedback sobre o Baseline, você pode registrar um problema em nosso
rastreador de problemas.

Written by

Categorias