Veja o que é necessário saber:
- O Chrome 100 tem um número de versão de três dígitos.
- Caminhe na memória e comemore #100CoolWebMoments desde o primeiro lançamento do Chrome.
- Há algumas mudanças importantes na string do user agent.
- Com a API Multi-Screen Window Placement, é possível enumerar as telas conectadas à máquina do usuário e posicionar janelas em telas específicas.
- E há muito mais.
Meu nome é Pete LePage. Vamos nos aprofundar e ver as novidades para os desenvolvedores no Chrome 100.
Chrome 100
Quando os navegadores chegaram à versão 10, houve alguns problemas, já que o número da versão principal passou de um dígito para dois. Espero ter aprendido algumas coisas que facilitarão a transição de dois dígitos para três.
O Chrome 100 está disponível agora e o Firefox 100 será lançado em breve. Esses números de versão de três dígitos podem causar problemas em sites que dependem da identificação da versão do navegador. Nos últimos meses, as equipes do Firefox e do Chrome realizaram experimentos nos quais o navegador informou a versão 100, mesmo que não fosse.
Isso causou alguns problemas informados, e muitos deles já foram corrigidos. Ainda precisamos da sua ajuda.
- Se você é mantenedor de um site, teste-o com o Chrome e o Firefox 100.
- Se você desenvolver uma biblioteca de análise do user agent, adicione testes para analisar versões maiores e iguais a 100.
Confira o Chrome e o Firefox em breve para alcançar a versão principal 100 em web.dev (links em inglês) para mais detalhes.
100 momentos legais na Web
Tem sido emocionante ver a Web crescer e ver todas as coisas incríveis que você criou nas últimas 100 versões do Chrome. Achamos que seria divertido andar em memória e comemorar #100CoolWebMoments que aconteceram nos últimos 14 anos.
Conte quais momentos você mais gostou. Se sentimos falta de alguma coisa, temos certeza que isso aconteceu, envie um tweet para @Chromiumdev com #100CoolWebMoments. Aproveite!
String do user agent reduzida
Falando em user agent, o Chrome 100 será a última versão compatível com uma string de user agent não reduzida por padrão. Isso faz parte de uma estratégia para substituir o uso da string do user agent pela nova API User-Agent Client Hints.
A partir do Chrome 101, o user agent será reduzido gradualmente.
Confira Datas e testes de origem de redução do user agent no [blog do Chromium][crblog] para saber o que será removido e quando.
API de posicionamento de janelas em várias telas
Para alguns apps, abrir novas janelas e colocá-las em lugares ou telas específicas é um recurso importante. Por exemplo, ao usar as Apresentações para apresentar, quero que os slides apareçam em tela cheia na tela principal e minhas anotações do apresentador apareçam na outra tela.
Com essa API, é possível enumerar as telas conectadas à máquina do usuário e posicionar janelas em telas específicas.
Você pode conferir rapidamente se há mais de uma tela conectada ao
dispositivo com window.screen.isExtended
.
const isExtended = window.screen.isExtended;
// returns true/false
No entanto, a principal funcionalidade está em window.getScreenDetails()
, que fornece
detalhes sobre as telas anexadas.
const x = await window.getScreenDetails();
// returns
// {
// currentScreen: {...}
// oncurrentscreenchange: null
// onscreenschange: null
// screens: [{...}, {...}]
// }
Por exemplo, você pode determinar a tela principal e usar
requestFullscreen()
para colocar um elemento em tela cheia.
try {
const screens = await window.getScreenDetails();
const primary = screens
.filter((screen) => screen.primary)[0]
await elem.requestFullscreen({ screen: primary });
} catch (err) {
console.error(err);
}
Ela também oferece uma forma de detectar mudanças. Por exemplo, se uma nova tela for conectada ou removida, a resolução mudar e assim por diante.
const screens = await window.getScreenDetails();
let numScreens = screens.screens.length;
screens.addEventListener('screenschange', (event) => {
if (screens.screens.length !== numScreens) {
console.log('Screen count changed');
numScreens = screens.screens.length;
}
});
Confira o artigo atualizado de Tom Como gerenciar várias telas com a API Multi-Screen Window Placement (link em inglês) no web.dev (link em inglês) para mais detalhes.
E muito mais.
Claro, há muito mais.
Há um novo método forget()
para dispositivos HID que permitem revogar uma
permissão para um dispositivo HID concedida por um usuário.
// Request an HID device.
const [device] = await navigator.hid.requestDevice(opts);
// Then later, revoke permission to the device.
await device.forget();
E para a WebNFC, o método makeReadOnly()
permite transformar tags NFC
permanentemente somente leitura.
const ndef = new NDEFReader();
await ndef.makeReadOnly();
Leia mais
Esses são apenas alguns dos principais destaques. Confira os links abaixo para ver outras mudanças no Chrome 100.
- Novidades do Chrome DevTools (100)
- Descontinuações e remoções do Chrome 100
- Atualizações do ChromeStatus.com para o Chrome 100
- Lista de alterações do repositório de origem do Chromium
- Agenda de lançamentos do Chrome
Fazer inscrição
Para ficar por dentro, inscreva-se no canal do YouTube para desenvolvedores do Chrome. Você receberá uma notificação por e-mail sempre que lançarmos um novo vídeo.
Meu nome é Pete LePage e, assim que o Chrome 101 for lançado, estarei aqui para dizer as novidades do Chrome.