Desenvolver experiências para a barra lateral no Microsoft Edge

A barra lateral no Microsoft Edge é um painel persistente localizado na lateral do navegador, que coexiste com o conteúdo principal do navegador. A barra lateral permite que os usuários acessem facilmente sites e utilitários populares junto com as guias do navegador. O conteúdo na barra lateral aumenta a tarefa principal do usuário, permitindo a navegação lado a lado e minimizando a necessidade de alternar contextos entre as guias do navegador. Usando a barra lateral no Microsoft Edge, os usuários podem acessar as ferramentas de produtividade de que precisam enquanto permanecem em seu fluxo de trabalho.

A barra lateral no Microsoft Edge, mostrando ferramentas úteis, juntamente com a guia principal

Como desenvolvedor, você pode aproveitar a barra lateral para suas próprias experiências de duas maneiras:

  • Adaptando seu PWA (Aplicativo Web Progressivo) existente para ser executado na barra lateral.
  • Usando a API da barra lateral em sua extensão do Microsoft Edge.

Escolha a abordagem certa

As duas maneiras diferentes pelas quais você pode aproveitar a barra lateral foram projetadas para atender às diferentes necessidades do desenvolvedor. A seguir estão as principais diferenças entre os aplicativos da barra lateral e as extensões da barra lateral:

Aspecto Aplicativo de barra lateral Extensão da barra lateral
Definição de termos Um PWA (Aplicativo Web Progressivo) que é executado na barra lateral. Uma extensão do Microsoft Edge que exibe conteúdo na barra lateral.
Distribuição Como um site, o aplicativo é hospedado no servidor Web do aplicativo. A extensão é distribuída em Complementos do Microsoft Edge.
Recursos O aplicativo pode usar todas as APIs e recursos da Web, bem como recursos do PWA, como suporte offline, push ou acesso ao sistema de arquivos. A extensão pode usar APIs de extensão poderosas, como ler ou modificar a página atual.
Contexto O aplicativo é executado em seu próprio contexto da Web, separado da guia principal. A extensão pode acessar a página da Web atual e modificar a página da Web por meio do script de conteúdo da extensão.
Instalação O usuário instala o aplicativo interagindo com a barra lateral ao visitar o site do aplicativo. A extensão é instalada por usuários de complementos do Microsoft Edge.
Experiência do usuário O aplicativo tem seu próprio ícone na barra lateral. Clicar no ícone abre a barra lateral se ela foi fechada e exibe o conteúdo do aplicativo. A experiência do usuário depende da extensão. A extensão pode abrir a barra lateral dependendo dos sites que o usuário visita no navegador.
Tecnologias usadas Desenvolvimento Web e PWA. Consulte Visão geral dos PWAs (Aplicativos Web Progressivos). Desenvolvimento de extensão. Consulte Visão geral das extensões do Microsoft Edge.

Os aplicativos da barra lateral permitem que você adapte seu Progressive Web App (PWA) existente para ser executado com segurança junto com outras guias do navegador para uma experiência de co-navegação lado a lado. Essa abordagem é uma ótima opção para desenvolvedores da Web que desejam oferecer experiências complementares, incluindo aplicativos sociais, de mensagens ou de mídia que não exigem recursos avançados de extensões.

A infraestrutura do aplicativo da barra lateral ajuda os usuários a descobrir e instalar aplicativos da barra lateral à medida que navegam na Web, proporcionando grande descoberta para seu aplicativo apenas fazendo uma simples alteração no arquivo de manifesto do aplicativo Web. Os aplicativos da barra lateral são uma ótima opção se você quiser reutilizar seu aplicativo Web existente para a barra lateral no Microsoft Edge e fazer uso total dos recursos da Web que estão disponíveis para PWAs.

Para saber mais sobre PWAs e como criá-los, consulte Visão geral dos PWAs (Aplicativos Web Progressivos). E para saber mais sobre como adaptar seu PWA existente à barra lateral no Microsoft Edge, consulte Criar um PWA para a barra lateral no Microsoft Edge.

As extensões do Microsoft Edge podem, opcionalmente, usar a API da barra lateral para mostrar uma interface do usuário personalizada na barra lateral do Microsoft Edge. Isso é um acréscimo aos outros locais em que as extensões também aparecem, como na barra de ferramentas do Microsoft Edge ou como pop-ups.

Se a experiência do seu aplicativo depender de APIs de extensões poderosas, por exemplo, para ler ou modificar a página atual, uma extensão de barra lateral fornecerá esses recursos. Os usuários podem encontrar e instalar essas extensões em Complementos do Microsoft Edge.

A equipe do Microsoft Edge continua a desenvolver esses modelos de extensibilidade da barra lateral e agradece seus comentários. Para deixar comentários, crie um novo problema no repositório ou pesquise problemas existentes e participe de conversas existentes.

Para saber mais sobre extensões do Microsoft Edge e como criá-las, consulte Visão geral das extensões do Microsoft Edge.

Para saber mais sobre como usar a API da barra lateral em sua extensão, confira Desenvolver uma extensão para a barra lateral do Microsoft Edge.