O Chrome 89 está começando a ser lançado para a versão estável.
Veja o que é necessário saber:
- WebHID, WebNFC e Web Serial passaram dos testes de origem e agora estão disponíveis na versão estável.
- Estamos fechando uma brecha que alguns desenvolvedores usavam para contornar as verificações de estabilidade do PWA.
- Compartilhamento da Web e destino do compartilhamento da Web chegam para computadores.
- E há muito mais.
Meu nome é Pete LePage, trabalho e filmo 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 os usuários que nunca foram possíveis antes, interagindo com hardware real.
Eles permitem que os criadores se conectem a hardwares divertidos e apps 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 MicroPython REPL em um Raspberry Pi Pico. A Web Serial também é usada pelo Espruino no ambiente de desenvolvimento integrado baseado na Web.
No CDS 2019, François criou um jogo divertido de memória usando a NFC da Web. Você teve que tocar no smartphone no cartão certo, na ordem certa.
E meu favorito, @bramus, usou o WebHID para se conectar a um StreamDeck, criando um pad de bateria Daft Punk. Se você não tiver uma StreamDeck, confira o vídeo de demonstração no YouTube e o código no GitHub.
Seja o site que interage com o hardware ou o hardware que pode interagir com muitos sites, os usuários ganham 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 início para WebHID, WebNFC e Web Serial.
Mudanças nos critérios de instalabilidade de PWAs
O suporte off-line sempre foi uma parte importante dos critérios de Progressive Web App para instalabilidade. Assim como em outros apps instalados, os usuários esperam que ele funcione de maneira confiável. Ele precisa ser rápido, e o dinossauro off-line não pode aparecer.
Ainda este ano, planejamos fechar uma brecha que permitia que alguns sites passassem nos critérios de instalabilidade sem uma experiência off-line. Se o PWA já tiver uma experiência off-line, está tudo certo. Não é necessário fazer nada, mas, se você não tiver, é hora de adicionar um.
A partir do Chrome 89, se o PWA não fornecer uma resposta válida quando estiver off-line, um aviso será exibido no DevTools na guia "Issues", e o Lighthouse 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. Mas, no mínimo, ela pode ser tão simples quanto uma página de substituição off-line.
Confira mais detalhes sobre a mudança e por que ela foi feita em Como melhorar a detecção de 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 acionar um worker de serviço pronto para produção para sua PWA. Ou, para uma página de fallback simples off-line, o artigo Criar uma página de fallback off-line tem todo o código necessário, que você pode copiar e colar diretamente no seu site.
Compartilhamento na Web e destino do compartilhamento na Web para computador
Se o site permite que os usuários criem, editem ou interajam com arquivos, use as APIs Web Share e Web Share Target. Essas APIs já estão disponíveis para dispositivos móveis há algum tempo, mas agora são compatíveis com o ChromeOS e o Windows.
O compartilhamento na Web permite que os usuários enviem 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 para que outros apps possam compartilhar 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 Integração com a interface de compartilhamento do SO com a API Web Share e Como receber dados compartilhados com a API Web Share Target para conferir guias para iniciantes.
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.
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 as mudanças adicionais no Chrome 89 nos links abaixo.
- Novidades do Chrome DevTools (89)
- Remoção e descontinuação de recursos 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
Se quiser 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.
Meu nome é Pete LePage, e assim que o Chrome 90 for lançado, estarei aqui para contar as novidades do Chrome.
Créditos
A foto dos Raspberry Pis e do Arduino é de Harrison Broadbent no Unsplash (em inglês).