Elementos básicos e compatibilidade
Miniapps são pequenos (normalmente de 2 a 4 MB) que exigem um superapp para serem executados. O que eles têm em comum, independentemente do superapp, é que são criados com ("dialetos" das tecnologias da Web HTML, CSS e JavaScript). O ambiente de execução de um miniapp é uma WebView no superapp, não no sistema operacional subjacente, o que torna os mini apps multiplataforma. O mesmo miniapp pode ser executado no mesmo superapp, independentemente de ser executado no Android, no iOS ou em outro SO. No entanto, nem todos os miniapps podem ser executados em todos os superapps. Vamos falar mais sobre isso mais tarde.
Discovery
Com frequência, miniapps são descobertos ad hoc usando códigos de barras 2D com a marca, o que resolve um desafio importante off-line para on-line, por exemplo, ir do menu de um restaurante físico para um miniapp de pagamento ou de uma patinete física para um miniapp de aluguel. A imagem abaixo mostra um exemplo desse código de barras 2D da marca para o miniapp de demonstração do WeChat com o miniapp de demonstração do WeChat. Outros superapps normalmente não conseguem reconhecer o código de barras.
![Código de barras 2d com a marca WeChat.](https://web.dev/static/articles/mini-apps/mini-app-about/image/wechat-branded-2d-barcode-e6ef7f80e48d8.jpg?authuser=6&hl=pt)
Miniapps também podem ser descobertos por meio de pesquisa normal no superapp, ser compartilhados em mensagens de chat ou fazer parte de um item de notícias em um feed de notícias. Alguns superapps têm a noção de contas verificadas que podem conter miniapps nos perfis. Miniapps podem ser destacados quando estão fisicamente próximos geograficamente, como o miniapp de uma empresa em frente ao qual o usuário está, ou praticamente perto, como quando o usuário vê rotas em um mapa mostrado no super app. Os miniapps usados com frequência estão disponíveis em uma gaveta de apps que, em muitos superapps, pode ser acessada com um gesto de deslizar para baixo ou com uma seção especial no menu do superapp.
A experiência do usuário
Todos os superapps têm mais ou menos a mesma interface do usuário para miniapps. Uma barra superior temática com o nome do miniapp e, no canto superior da tela, um botão "Fechar" na extremidade direita precedido por um menu de ações que fornece acesso a recursos comuns, como compartilhar o app, adicioná-lo a uma lista de favoritos ou à tela inicial, denunciar apps abusivos, fornecer feedback e configurações. A captura de tela abaixo mostra um miniapp do Shopping em execução no contexto do superapp Alipay com o menu de ações aberto.
![O superapp Alipay executando um mini app de compras com a barra superior destacada, o botão do menu de ação e o botão "Fechar". O menu de ações é aberto.](https://web.dev/static/articles/mini-apps/mini-app-about/image/the-alipay-super-app-runn-39dde18ae385b.jpg?authuser=6&hl=pt)
paradigmas de IU
Normalmente, há uma barra de guias na parte de baixo da tela para a navegação principal do miniapp. A maioria dos provedores de superapps oferece componentes que ajudam os desenvolvedores a implementar paradigmas de IU comuns rapidamente, como carrosséis, acordeões, barras de progresso, ícones de carregamento, chaves, mapas e assim por diante. Isso também ajuda a tornar a experiência do usuário entre diferentes miniapps consistente, o que é incentivado pelas Diretrizes de design de mini programas do WeChat (link em inglês). Isso é parecido com o que a Apple incentiva com as Diretrizes para interface humana da Apple e com o Google com suas recomendações de Design para Android.
![O miniapp de demonstração do Douyin que mostra o componente de controle deslizante do Douyin (carrossel) com botões para avanço automático, indicadores de pontos etc.](https://web.dev/static/articles/mini-apps/mini-app-about/image/the-douyin-demo-mini-app-fbf61969fee88.png?authuser=6&hl=pt)
Disponibilização
Em vez de serem veiculados por partes como recursos separados, os miniapps são veiculados como pacotes criptografados, ou seja, como arquivos que contêm todos os recursos em um único arquivo. Ao contrário de apps da Web comuns, eles também não são veiculados a partir da origem específica do criador do miniapp, mas diretamente do provedor do superapp. Eles ainda podem acessar as APIs dos servidores do criador de miniapps, mas os recursos principais (normalmente chamados de shell do app) precisam ser disponibilizados pelo provedor do superapp. Miniapps precisam declarar a origem da solicitação de dados adicionais.
Armazenamento em cache, atualizações e links diretos
Os miniapps são mantidos no cache do superapp. Assim, na próxima vez que o usuário iniciar um miniapp em cache, ele será carregado quase instantaneamente. Se houver uma atualização, um novo pacote de apps será carregado. O número da versão pode fazer parte do URI de inicialização (consulte Descoberta), para que o superapp saiba desde o início se a versão armazenada localmente em cache ainda é atual. O URI de inicialização também contém a página desejada do miniapp. Portanto, é possível criar links diretos para páginas específicas desses miniapps. Por meio de um sitemap, os miniapps podem declarar quais páginas precisam ser indexáveis pelo rastreador de miniaplicativos do provedor do superapp.
![macOS Finder mostrando uma pasta contendo arquivos do mini app WeChat ".wxapkg" armazenados em cache.](https://web.dev/static/articles/mini-apps/mini-app-about/image/macos-finder-showing-fol-d1f228bbf9ff2.png?authuser=6&hl=pt)
Segurança e permissões
Miniapps são revisados pelo provedor de superapps, o que significa que os usuários os consideram mais seguros do que apps da Web. Eles precisam declarar as permissões potencialmente necessárias de antemão em um arquivo de configuração de manifesto ou mini app, o que, para alguns provedores, também exige explicações de por que cada permissão é necessária. Miniapps ainda podem mentir, mas seria difícil justificar por que estão, por exemplo, tentando acessar sensores de movimento sem um motivo aparente para o usuário. O incentivo para usar a impressão digital do usuário é bem menor em comparação com a Web, porque o usuário normalmente já fez login no superapp (consulte Gráfico de identidade, pagamento e social).
Sempre que um miniapp executa uma operação que requer uma permissão especial, é mostrado ao usuário uma solicitação que, se aplicada pela plataforma, também inclui a justificativa de uso, conforme declarado pelo desenvolvedor. A captura de tela abaixo mostra o mini app de demonstração do Doyin, que solicita permissão ao usuário para compartilhar a localização dele. Em alguns superapps, também há uma API imperativa que os miniapps podem usar para solicitar permissões sem usá-las imediatamente ou para verificar apenas o status de uma permissão. Isso pode até incluir uma API para abrir as configurações centrais de permissão do superapp, que correspondem às Configurações do site no Chrome. Miniapps também precisam declarar de antemão as origens de todos os servidores de onde potencialmente solicitarão dados.
![O miniapp de demonstração do Douyin mostrando uma solicitação de geolocalização com duas opções: "Não permitido" e "Permitido".](https://web.dev/static/articles/mini-apps/mini-app-about/image/the-douyin-demo-mini-app-bab6b3dbfe49e.png?authuser=6&hl=pt)
Acesso a recursos avançados
O superapp de hospedagem oferece acesso a APIs avançadas por uma ponte JavaScript que é injetada na
WebView oferecida pelo superapp. Consulte
Elementos básicos e compatibilidade. Essa ponte JavaScript fornece hooks para as APIs do sistema operacional. Por exemplo, uma função JavaScript de miniapp, como
getConnectedWifi()
, ou seja, a capacidade de um miniapp de saber o nome da rede Wi-Fi ativa
no momento, é facilitada pela API
getConnectionInfo()
do Android ou pela API
CNCopyCurrentNetworkInfo()
do iOS. Outros exemplos de APIs de dispositivos poderosas expostas em superapps comuns são Bluetooth, NFC, iBeacon, GPS, área de transferência do sistema, sensores de orientação, informações da bateria, acesso à agenda, acesso à agenda, controle de brilho da tela, acesso ao sistema de arquivos, hardware vibratório para feedback físico, acesso à câmera e ao microfone, gravação de tela e criação de capturas de tela, status de rede, soquetes UDP, leitura de código de barras, informações de memória do dispositivo e muito mais.
![Miniapp de demonstração do WeChat mostrando um controle deslizante que controla o brilho da tela do dispositivo no nível máximo.](https://web.dev/static/articles/mini-apps/mini-app-about/image/the-wechat-demo-mini-app-964b40a49071.png?authuser=6&hl=pt)
Acesso a serviços em nuvem
Muitos superapps também oferecem acesso "sem servidor" a serviços em nuvem do provedor de superapp que, além da computação em nuvem bruta e do armazenamento em nuvem, geralmente também incluem tarefas de alto nível, como tradução de texto, detecção de objetos ou classificação de conteúdo em imagens, reconhecimento de fala ou outras tarefas de machine learning. Miniapps podem gerar receita com anúncios, que geralmente são disponibilizados por superprovedores de apps. As plataformas de superapps geralmente também fornecem dados de análise da nuvem, para que os desenvolvedores de miniapps possam entender melhor como os usuários interagem com os apps.
Identidade, pagamento, gráfico social
Um recurso muito importante dos miniapps são as informações do gráfico social e de identidade compartilhadas do superapp. Superapps, como o Douyin ou o WeChat, começaram como sites de rede social no sentido mais amplo, em que os usuários têm uma identidade (às vezes verificada pelo governo), uma rede de amigos ou seguidores e, com frequência, também dados de pagamento armazenados. Por exemplo, um miniapp de compras pode (ou às vezes até precisa) processar todos os pagamentos diretamente pelas APIs de pagamento do superapp e, com o consentimento do usuário, pode coletar dados do usuário, como endereço de entrega, número de telefone e nome completo, sem precisar forçar o usuário a preencher formulários. Abaixo, é possível ver o miniapp do Walmart em execução no WeChat, aberto pela primeira vez, me cumprimentando com um rosto conhecido.
![O miniapp do Walmart mostrando o rosto e o nome do autor na guia "Eu".](https://web.dev/static/articles/mini-apps/mini-app-about/image/the-walmart-mini-app-show-87a18e926c07a.png?authuser=6&hl=pt)
Os miniapps podem ficar muito populares ao permitir que as pessoas compartilhem conquistas, como maiores pontuações em um jogo, e desafiem os contatos por meio de atualizações de status. Assim, o miniapp está a apenas um toque de distância. Assim, os usuários podem entrar em competição sem interrupções e aumentar o alcance do miniapp.
Agradecimentos
Este artigo foi revisado por Joe Medley, Kayce Basques, Milica Mihajlija, Alan Kent e Keith Gu.