Descubra alguns dos recursos interessantes que chegaram aos navegadores da Web estáveis e Beta em junho de 2022.
Versões estáveis do navegador
Em junho, o Chrome 103 e o Firefox 102 ficaram estáveis.
Streams de transformação e streams de bytes legíveis
O Firefox 102 inclui suporte para Transform Streams. Isso permite o encadeamento de ReadableStream para WritableStream, executando uma transformação nos blocos. É ótimo ver esse recurso disponível nos três mecanismos, o que torna esse um momento muito bom para aprender sobre streams.
Streams de bytes legíveis também são compatíveis com o Firefox 102, permitindo um leitor de BYOB (traga seu próprio buffer) com a interface ReadableStreamBYOBReader. Isso pode ser usado para fazer streaming de dados fornecidos pelo desenvolvedor.
Acessar fontes instaladas localmente
O Chrome 103 inclui a API Local Font Access, que permite acesso às fontes instaladas localmente do usuário. Depois de solicitar o acesso às fontes instaladas no dispositivo, chame window.queryLocalFonts() para receber uma matriz das fontes instaladas.
const pickedFonts = await window.queryLocalFonts();
for (const fontData of pickedFonts) {
console.log(fontData.postscriptName);
console.log(fontData.fullName);
console.log(fontData.family);
console.log(fontData.style);
}
O recurso de mídia update
O Firefox 102 inclui o recurso de mídia update. É usado para consultar se o dispositivo de saída pode modificar a aparência do conteúdo depois de renderizado.
Um novo código de status HTTP: 103 dicas antecipadas
O Chrome 103 adiciona um novo código de status HTTP 103 Early Hints. Se o servidor ou o CDN souber que um determinado conjunto de sub-recursos é necessário para carregar uma página, ele poderá aconselhar o navegador a pré-conectar-se às origens ou até mesmo a pré-carregar recursos conforme a página que os exige. É preciso atualizar seu servidor ou CDN para aproveitar o recurso. Saiba mais sobre as dicas iniciais.
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 em abril foram Chrome 104, Firefox 103 e Safari 16.
Nova sintaxe para consultas de mídia de intervalo
O Chrome 104 inclui a nova sintaxe para consultas de mídia de intervalo, da especificação de consultas de mídia nível 4. Por exemplo, uma consulta de mídia escrita anteriormente desta forma:
@media (min-width: 400px) { … }
Agora pode ser escrita assim:
@media (width >= 400px) { … }
API Region Capture
O Chrome 104 para computadores também inclui a API Region Capture. Dessa forma, é possível cortar e remover o conteúdo do vídeo capturado antes de compartilhá-lo.
O Safari 16 traz vários recursos importantes para o navegador
O Safari 16 parece ser mais um lançamento empolgante da equipe do Safari. Essa versão adiciona vários recursos incluídos na Interoperabilidade de 2022. É ótimo ver tudo que vai acontecer na metade do ano. Estou destacando alguns dos meus recursos favoritos aqui, mas confira as notas da versão para saber mais.
Junto com muitos desenvolvedores, estou muito animado com a compatibilidade com consultas de tamanho para consultas de contêiner, um recurso que também está por trás de uma sinalização no Chrome.
No Safari 16, também há suporte para o valor subgrid para grid-template-columns e grid-template-rows. Esse recurso já está no Firefox e em desenvolvimento no Chrome e permite que o dimensionamento de faixas de grade seja herdado por grades aninhadas.
Para o layout de grade, também é possível animar faixas de grade.
Compatibilidade com navegadores
- 107
- 107
- 66
- 16
Foi incluído o método showPicker(), que permite uma maneira canônica de mostrar um seletor de navegador para datas, horário, cor e arquivos. Saiba mais sobre isso em Mostrar um seletor do navegador para data, hora, cor e arquivos.
Os problemas de acessibilidade do display: contents também foram resolvidos, o que torna esse recurso útil seguro para uso sem o risco de remover elementos da árvore de acessibilidade.
Esses recursos Beta estarão disponíveis em navegadores estáveis em breve.
Parte da série para iniciantes na Web