Aplicativos Web progressivos no Windows

Com os aplicativos Web progressivos \ (ou simplesmente PWAs ), você não precisa decidir entre usar tecnologias abertas da Web para interoperabilidade entre plataformas e fornecer aos seus usuários uma experiência de aplicativo nativo personalizada para seus dispositivos. PWAs são apenas sites que são progressivamente aprimorados para funcionar como aplicativos nativos em plataformas de suporte. As qualidades de um PWA combinam o melhor dos aplicativos Web e nativos.

Ícone detectável

Detectáveis

Nos resultados da pesquisa na Web e nos repositórios de aplicativos de suporte

Ícone instalável

Instaláveis

Fixar e iniciar na tela inicial, no menu Iniciar, na barra de tarefas e assim por diante

Ícone recontratar

Recontratar

Enviar notificações por push, mesmo quando o aplicativo não estiver ativo

Ícone independente de rede

Independente de rede

O Works offline e em condições de rede baixa

Ícone progressivo

Progressivas

A experiência pode ser dimensionada para cima (ou para baixo) com recursos de dispositivo

Ícone de segurança

Desligar

Fornece um ponto de extremidade HTTPS seguro e outras proteções de usuário

Ícone responsivo

Responsivo

Adapta-se ao tamanho da tela ou orientação e método de entrada do usuário

Ícone vinculável

Vinculável

Compartilhar e iniciar a partir de um hiperlink padrão

Ao criar ou converter seu site existente em um PWA, você se envolve melhor com seu público-alvo existente usando notificações por push, integração do tipo de aplicativo e suporte offline. Ao mesmo tempo, você deve continuar a criar seu público-alvo na Web em aberto, pois os usuários detectam o PWA por meio de pesquisa e compartilhamento de links. O melhor de tudo é que você pode atualizar seu aplicativo simplesmente atualizando o código do servidor Web.

PWAs no Microsoft Edge (Chromium)

Quando você cria um aplicativo Web progressivo direcionado a APIs da Web Standard, seu aplicativo pode ser implantado entre plataformas e dispositivos e aproveitando os recursos específicos do dispositivo como disponíveis. O PWAs no Microsoft Edge \ (Chromium ) são completamente baseados em padrões de uma perspectiva de plataforma da Web e permitem que os usuários instalem o aplicativo diretamente no navegador sem a necessidade de implantação ou registro baseados na loja. A área de trabalho PWAs são compatíveis com qualquer uma das plataformas o Microsoft Edge \ (Chromium ) está disponível, incluindo Windows 7, Windows 10 e macOS. Outros benefícios incluem:

  • Os aplicativos podem ser instalados diretamente no navegador pelo ícone de instalação na barra de navegação.

    Instalar submenu e ícone do aplicativo

  • Os aplicativos também podem ser instalados, executados e gerenciados no menu configuraçõesde > aplicativos

    Itens de menu do aplicativo em configurações

  • As notificações da Web são integradas ao sistema de notificação do Windows

  • Repositório de cookies compartilhados com o perfil do navegador que instalou o aplicativo

  • Acesso a outros recursos do navegador por meio do ... menu, incluindo a validação do certificado, as permissões de site, a proteção de rastreamento e as extensões do navegador

  • Acesso total ao Microsoft Edge devtools para depurar seu aplicativo

Importante

Para personalizar o PWAs especificamente para o Windows 10 que faz solicitações de API do WinRT usando JavaScript, consulte a documentação específica para os recursos do PWA do EdgeHTML. Saiba mais sobre como testar o PWA no Windows 10 e distribuí-lo na Microsoft Store.

Observação

Confira a sessão Build 2020 PWA para obter uma visão geral dos benefícios do PWA, recursos futuros e demonstrações curtas.

Requisitos

Para ser executado como um PWA, seu aplicativo Web hospedado no servidor deve incluir os requisitos mínimos a seguir.

Requisito Detalhes
HTTPS Proteja seus usuários fornecendo uma conexão segura para comunicação do servidor ou do aplicativo. Os funcionários do serviço e outras tecnologias do PWA só funcionam com recursos da Web servidos por meio de uma conexão segura \ (ou de localhost para fins de depuração ).
Profissionais de Serviço Use threads de trabalho do serviço para atuar como proxies de rede entre o aplicativo cliente e servidor para fornecer suporte offline, armazenamento em cache de recursos, notificações por push, sincronização de dados em segundo plano e otimizações de perf de carregamento de página.
Manifesto do aplicativo Web Forneça um arquivo de metadados baseado em JSON que descreve as principais informações sobre o seu aplicativo Web \ (como ícones, idioma e ponto de entrada de URL ), para que o Windows 10 e outras plataformas de host possam fornecer aos usuários do PWA uma experiência instalável e parecida com o aplicativo nativo.

Para ser um grande PWA, seu aplicativo também deve atender aos seguintes requisitos.

Requisito Detalhes
Compatibilidade entre navegadores Certifique-se de que o PWA funcione testando em diferentes navegadores e ambientes.
Design dinâmico Empregue layouts fluidos e imagens flexíveis com gradeCSS, flexbox, grade CSS e flexbox , consultas de mídiae imagens responsivas para adaptar sua experiência ao dispositivo do usuário. Use [ferramentas de emulação de dispositivo][DevToolsGuide ::ref1:: ] do seu navegador para testar localmente ou configure uma sessão de depuração remota para testar diretamente um dispositivo de destino.
Vinculação profunda Encaminhar cada página do seu site para um URL exclusivo para que os usuários existentes possam ajudá-lo a envolver um público ainda mais amplo por meio do compartilhamento de mídia social.
Práticas recomendadas Use ferramentas de qualidade de código como o webhint para otimizar a eficiência, a robustez, a segurança e a acessibilidade do seu aplicativo.
Lista de verificação do Chromium PWA Verifique seu PWA em relação à lista de verificação do Google Baseline PWA.

Se você quiser transformar o PWA em um aplicativo da Microsoft Store , vá para a documentação dos aplicativos Web progressivos (EdgeHTML) .