O Chrome 89 está começando a ser lançado para a versão estável.
O que você precisa saber:
- Os recursos WebHID, WebNFC e Web Serial foram atualizados dos testes de origem e agora estão disponíveis na versão estável.
- Estamos fechando uma brecha que alguns desenvolvedores usavam para evitar as verificações de capacidade de instalação de PWAs.
- O Web Share e o Web Share Target chegam ao computador.
- E há muito mais.
Eu sou Pete LePage, trabalhando e gravando de casa. Vamos conferir as novidades para desenvolvedores no Chrome 89!
WebHID, WebNFC e Web Serial
Estou muito animado com o WebHID, o WebNFC e o Web Serial. Eles abrem novos cenários para usuários que nunca foram possíveis antes, interagindo com hardware do mundo real.
Eles permitem que os criadores de conteúdo se conectem a hardware divertido e peculiar, aplicativos de videoconferência para usar os botões de telefonia dedicados em alto-falantes especializados. Ou qualquer número de outros casos de uso.
Usando a Web Serial e cerca de 60 linhas de código, @AndreBan criou uma página que pode interagir com o REPL do MicroPython em um Raspberry Pi Pico. A API Web Serial também é usada pelo Espruino no IDE baseado na Web.
Na CDS 2019, Francois escreveu um jogo divertido de estilo de memória usando a Web NFC. Você precisava tocar no smartphone para o cartão certo, na ordem certa.
E meu favorito, @bramus, usou o WebHID para se conectar a um StreamDeck, criando um pad de bateria do Daft Punk. Se você não tiver um StreamDeck, assista o vídeo de demonstração no YouTube e confira o código no GitHub.
Seja seu site que interage com o hardware ou o hardware que pode interagir com muitos sites, os usuários se beneficiam porque não precisam instalar drivers ou softwares especiais.
Saiba mais sobre alguns dos dispositivos que podem ser conectados em web.dev/devices ou confira os guias de primeiros passos para WebHID, WebNFC e Web Serial.
Mudanças nos critérios de capacidade de instalação de PWAs
O suporte off-line é uma parte fundamental dos critérios de capacidade de instalação dos Progressive Web Apps desde o início. Assim como outros apps instalados, os usuários esperam que ele funcione de maneira confiável. Ele precisa ser rápido, e o dinossauro off-line nunca deve aparecer.
Ainda este ano, planejamos fechar uma brecha que permitia que alguns sites passassem pelos critérios de capacidade de instalação sem uma experiência off-line. Se o PWA já tiver uma experiência off-line, não é preciso fazer mais nada. Nenhuma ação é necessária, mas, se você não tiver, é hora de adicionar uma!
A partir do Chrome 89, se o PWA não fornecer uma resposta válida quando estiver off-line, um aviso vai aparecer no DevTools na guia "Problemas", e o Lighthouse vai indicar que há um problema. A aplicação vai começar no Chrome 93, ainda este ano.
Você pode decidir que tipo de experiência off-line quer oferecer. O ideal é fornecer o máximo possível da sua experiência. No entanto, no mínimo, ela pode ser tão simples quanto uma página de substituição off-line.
Saiba mais sobre a mudança e o motivo dela em Melhorar a detecção do suporte off-line de apps da Web progressivos.
Se você não souber por onde começar, confira o Workbox. Ele tem um conjunto de bibliotecas que podem alimentar um service worker pronto para produção para seu PWA. Ou, para uma página de substituição off-line simples, o artigo Criar uma página de substituição off-line tem todo o código necessário, e você pode copiar e colar diretamente no seu site.
Compartilhamento na Web e destino de compartilhamento na Web para computador
Se o site permitir que os usuários criem, editem ou interajam com arquivos, use as APIs Web Share e Web Share Target. Essas APIs estão disponíveis em dispositivos móveis há algum tempo, mas agora são compatíveis com o ChromeOS e o Windows.
Com o Web Share, os usuários podem enviar arquivos ou dados para outros apps instalados no dispositivo, por exemplo, compartilhar uma foto do Google Fotos no Twitter.
async function share(title, text, url) {
try {
await navigator.share({title, text, url});
return true;
} catch (ex) {
console.error('Share failed', ex);
return false;
}
}
Para se registrar como um destino e permitir que outros apps compartilhem arquivos ou dados com você, use a API Web Share Target.
"share_target": {
"action": "/?share-target",
"method": "POST",
"enctype": "multipart/form-data",
"params": {
"files": [
{
"name": "file",
"accept": ["image/*"],
},
],
},
},
Confira os guias para iniciantes em Integrar com a interface de compartilhamento do SO usando a API Web Share e Receber dados compartilhados com a API Web Share Target.
E mais
E, é claro, há muito mais.
O Chrome agora permite await de nível superior em módulos JavaScript.
Para reduzir a confusão dos usuários, atualizamos o ícone mostrado na omnibox para PWAs instaláveis.
Além disso, se você usou uma atividade da Web confiável para disponibilizar seu PWA na Play Store para ChromeOS, inscreva-se no teste de origem da API Digital Goods.
Leitura adicional
Isso abrange apenas alguns dos principais destaques. Confira os links abaixo para outras mudanças no Chrome 89.
- Novidades do Chrome DevTools (89)
- Descontinuações e remoções do Chrome 89
- Atualizações do ChromeStatus.com para o Chrome 88
- Novidades do JavaScript no Chrome 88
- Lista de mudanças do repositório de origem do Chromium
Inscrever-se
Quer ficar por dentro dos nossos vídeos? Inscreva-se no canal do YouTube para desenvolvedores do Chrome e receba uma notificação por e-mail sempre que lançarmos um novo vídeo.
Sou Pete LePage e, assim que o Chrome 90 for lançado, vou estar aqui para contar as novidades do Chrome!
Créditos
As fotos dos Raspberry Pis e do Arduino são de Harrison Broadbent no Unsplash