PWA vs Flutter: uma comparação detalhada

Com todas as complicações acontecendo entre essas tecnologias, é compreensível que você possa achar um pouco confuso no início ao tentar aprender a diferença entre as duas tecnologias – Progressive Web App e Flutter. Afinal, eles soam muito semelhantes em teoria, pois ambos podem ser usados ​​para fornecer experiências envolventes em todos os dispositivos, usando uma única base de código.

Em um esforço para diferenciar essas duas, hoje vamos mergulhar profundamente nessas duas tecnologias, desde a maneira como elas funcionam até o uso na vida real. Vamos direto ao assunto:

Uma breve visão geral

O que é PWA?

Para simplificar, os Progressive Web Apps são sites que parecem um aplicativo. A tecnologia é uma mistura dos melhores recursos da Web e de aplicativos nativos, o que significa que os usuários que usam o PWA podem se beneficiar de todos os recursos anteriormente exclusivos de aplicativos nativos, como notificações por push, geolocalização etc. os melhores recursos da Web

É uma nova tecnologia promissora; e combinado com a adoção em massa de todos os grandes, incluindo a Microsoft, com seu recente lançamento do PWA no Windows, você pode ter certeza de que só verá mais do PWA a partir de agora.

O que é Flutter?

Conhecido por sua capacidade de desenvolvimento de pixels perfeitos, o Flutter é o mais recente SDK (Software Development Kit) de código aberto do Google para realizar o trabalho se você deseja criar aplicativos móveis que tenham a aparência de um aplicativo nativo e ainda sejam multiplataforma disponível. Isso significa que os aplicativos Flutter são criados com uma única base de código em mente, reduzindo substancialmente os custos de desenvolvimento.

Isso pode parecer muito semelhante ao Progressive Web App, mas podemos garantir que os mecanismos subjacentes que tornam todas essas experiências de aplicativos nativos possíveis são muito diferentes.

Entrando nas especificidades

Linguagem

Os Progressive Web Apps, como dito anteriormente, são mais parecidos com o novo padrão da web e não há uma regra estrita sobre em qual linguagem de programação eles devem ser codificados. linguagens baseadas como JavaScript ainda é fundamental para o desenvolvimento do PWA.

O Flutter, por outro lado, usa a linguagem de programação Dart . Dart é uma linguagem de programação totalmente orientada a objetos e, como possui um estilo de sintaxe baseado em C, é fácil de aprender e aprender se você estiver familiarizado com o estilo de sintaxe semelhante. Além disso, o Dart pode ser compilado para código ARM e x86 e, com a versão mais recente do Flutter, você pode até esperar poder transpilá-lo para JavaScript para que seu código Dart possa ser executado efetivamente na web.

Complexidade

Como o PWA é baseado em JavaScript, que é uma linguagem mais antiga e madura, você pode esperar que a curva de aprendizado seja mais tolerante, pois existem inúmeras estruturas e bibliotecas JavaScript disponíveis para você escolher. Flutter - sendo uma linguagem muito mais recente - pode parecer um pouco mais complicado à primeira vista, pois tudo, desde a interface do usuário até o código lógico, pode parecer mais ou menos misturado no Flutter. E como tudo é basicamente um widget no Flutter , você pode se encontrar em situações em que acaba com uma 'árvore de widgets' incomumente grande, profunda e complexa.

atuação

Quando se trata de desempenho, esses dois estão de igual para igual e não uma partida unilateral como seria de esperar. Quando comparado a um aplicativo Flutter, um PWA típico deve ter um pouco de desempenho ao tentar 'falar' diretamente com o código nativo - pois o PWA muitas vezes ainda precisa usar uma ponte JavaScript para obter acesso aos recursos subjacentes do dispositivo , por exemplo, GPS, câmera, etc.

No entanto, ao analisar os benchmarks, fica claro que os frameworks JavaScript, por exemplo, NodeJS , podem funcionar no mesmo nível, se não melhor que o Dart (a espinha dorsal dos aplicativos Flutter) em várias ocasiões.

Isso se deve ao fato de que o JavaScript pode aproveitar melhor a natureza multicore das CPUs modernas e distribuir as cargas de trabalho de maneira mais uniforme, apesar da linguagem em si ser de um único thread por natureza. Com o recente módulo worker_threads introduzido pelo NodeJS, que permite o uso de threads para execuções paralelas do processo JavaScript, o JavaScript agora pode lidar melhor com cargas de trabalho intensivas da CPU e pode realmente superar linguagens como Dart.

Características

Não há dúvida de que o Flutter - um SDK feito especificamente para o desenvolvimento multiplataforma de aplicativos móveis - é muito mais funcional do que o PWA, que é construído em tecnologias da Web. Os aplicativos Flutter têm uma integração mais profunda com o sistema e, portanto, são capazes de aproveitar mais recursos nativos do dispositivo.

Além disso, quando se trata da experiência geral do usuário, o Flutter tem a vantagem aqui, pois adota uma filosofia de pixel perfeito com a qual os usuários das plataformas iOS e Android podem experimentar a mesma experiência perfeita.

Isso se deve ao fato de o Flutter renderizar seus próprios componentes de interface do usuário, ao contrário da maioria dos outros frameworks que usam componentes nativos da plataforma. Dessa forma, os aplicativos Flutter são muito mais consistentes entre os dispositivos, mas, consequentemente, um tamanho típico de aplicativo Flutter é significativamente maior do que um PWA típico. Um simples “Olá, mundo!” O aplicativo Flutter, por exemplo, pode ter mais de 7 MB de tamanho, enquanto um PWA com o mesmo conteúdo nunca ultrapassa a marca de 1 MB.

Casos de uso

Então, quando um deles deve ser escolhido? Bem, é aí que fica difícil (foi o que ela disse), pois ambos podem oferecer experiências de usuário praticamente idênticas em diferentes plataformas e dispositivos diferentes. O ponto-chave é qual ponto forte dessas tecnologias você prefere mais – alcance ou experiência do usuário.

Naturalmente, o PWA depende da tecnologia da Web e é por isso que ele pode atingir um público mais amplo e pode até estar disponível na Microsoft Store, expandindo efetivamente seu alcance para toda a base de instalação do Windows 10 de quase 700 milhões de usuários mensais ativos.

Um aplicativo Flutter, por outro lado, e com sua filosofia pixel-perfect, pode tornar a experiência no aplicativo muito mais envolvente e ainda ser uma solução econômica para empresas, pois apenas uma base de código é necessária para o Android e plataformas iOS.

Exemplos

Dos aplicativos PWAs e Flutter que reunimos, esses são os mais proeminentes que achamos que podem representar melhor seus recursos:

Flutter — The New York Times

O Flutter iniciou seu novo capítulo muito recentemente em meados de 2019, pois seu potencial foi validado com a nova versão Flutter Web do jogo KENKEN do New York Times.

Para os desenvolvedores que estão trabalhando para que a versão Web de seus aplicativos Flutter aconteça, esta é uma ótima notícia, pois mostra do que o framework Flutter é capaz quando levado ao máximo.

PWA—Twitter Lite

Pode-se dizer que o Twitter Lite é a implementação de PWA mais bem-sucedida de todos os tempos, pois faz o que o PWA faz de melhor: oferecendo experiências envolventes e semelhantes a aplicativos em todos os dispositivos. Os usuários que desejam experimentar o Twitter PWA podem iniciar o aplicativo em todos os dispositivos que possam imaginar, seja em desktop, celular ou tablet…

E a principal distinção do PWA com melhor desempenho, quando comparado aos aplicativos Flutter com o mesmo desempenho, é que o tamanho total do seu PWA não deve ocupar mais de 2 MB no seu dispositivo.

Depois de converter seu site em um PWA, o Twitter obteve resultados impressionantes. Os números falam por si:

• 20% de queda na taxa de rejeição,
• Aumento de 65% nas páginas por sessão,
• Aumento de 75% nos Tweets enviados.

 Artigo relacionado: 12 exemplos de aplicativos da Web progressivos para sua inspiração

Um PWA Flutter, é possível?

O suporte da Web para Flutter já é uma discussão em andamento e em seu estágio beta. O processo de disponibilizar seu Flutter na Web pode ser tão simples quanto compilar Dart para JavaScript, em vez de compilá-lo para o código de máquina ARM usado para aplicativos móveis.

Existem, ainda, algumas complicações que tornam tudo isso um pouco mais difícil; mas, como observado no jogo KENKEN do New York Times acima, é possível fazer uma implementação decente da Web de aplicativos Flutter, e o Flutter PWA provavelmente será uma coisa em breve.

Conclusão

Como ambas são tecnologias relativamente novas com muito potencial, pode valer a pena explorar mais opções e ver por si mesmo qual é a mais adequada para suas necessidades de desenvolvimento.

Na SimiCart, somos uma agência de desenvolvimento de PWA reconhecida pelo Google, pronta para trazer a experiência de compra de última geração para sua loja Magento.

Consulte Mais informação:
PWA vs Electron: um mergulho profundo

O que é um PWA? Tudo o que você precisa saber sobre o Progressive Web App

Magento PWA Studio vs Vue Storefront: Qual é para você?