PWA Fitness: App Sem App Store | Guia Técnico 2025

A verdade sobre criar apps sem App Stores

Você não precisa da permissão da Apple ou Google para lançar um app mobile profissional. Com meu amigo treinador esportivo, criei o WorkoutGen - um gerador de treinos que cria programas de musculação em academia personalizados - como uma Progressive Web App que funciona perfeitamente em todos os dispositivos sem tocar na App Store ou Google Play.

Este artigo compartilha minha experiência real construindo e implementando uma PWA em produção, incluindo as vantagens econômicas (~25% mais receita por cliente), os desafios técnicos (especialmente os bugs de reprodução de vídeo do Safari) e as estratégias de adoção que implementei. A realidade é mais nuançada que o hype de marketing, mas as oportunidades são reais.

O que torna uma PWA de fitness excelente?

Uma PWA profissional de treino deve entregar (e o WorkoutGen implementa tudo isso):

• Arquitetura offline-first - Treinos acessíveis sem internet
• Performance nativa - Animações suaves, respostas instantâneas
• Gerenciamento de mídia - Vídeos ou GIFs de exercícios que funcionam em todas as plataformas
• Prompts de instalação - Onboarding claro para usuários não familiarizados com PWAs
• Integração de pagamento - Cobrança direta pelo Lemon Squeezy (0% de taxas de plataforma vs. 30% das lojas)
• Consistência cross-platform - Experiência idêntica no iOS, Android, desktop

Por que escolhi PWA em vez de apps nativos

A economia é convincente

App Stores tradicionais:

• 30% de comissão em todas as transações (Apple, Google)
• Taxas anuais de desenvolvedor ($99-$299)
• Sistema de compra in-app obrigatório
• Divisão de receita em assinaturas (ano 1: 30%, ano 2+: 19%)

PWA + Lemon Squeezy direto:

• 0% de comissão de plataforma
• 5%+50¢ de taxa de processamento Lemon Squeezy
• Controle total sobre lógica de cobrança
• Atualizações de pagamento instantâneas (sem atrasos de 24-48h da App Store)

Para uma assinatura de $10/mês, você fica com $7,00 com app stores vs. $9,00 com Lemon Squeezy. Isso é ~25% mais receita por cliente.

A realidade do desenvolvimento

E as soluções cross-platform?

Antes de apostar tudo em PWA, avaliei as principais alternativas cross-platform:

React Native / Flutter: Prometeram "escreva uma vez, rode em todo lugar", mas ainda exigiam:

• Pipelines de build separadas para iOS e Android
• Código específico de plataforma para recursos nativos
• Submissões à app store e atrasos de aprovação
• Downloads de apps de 40-60MB+
• Aprender Dart (para Flutter) - uma nova linguagem com ecossistema menor que JavaScript

Capacitor (Wrapper Híbrido): Útil para acessar APIs nativas, mas adiciona complexidade:

• 15MB de overhead apenas para o wrapper
• Ainda precisa de aprovação da app store para distribuição
• Perde a vantagem de atualização instantânea dos web apps puros
• Melhor usado como melhoria opcional, não como requisito

PWA + Capacitor (minha escolha): Construí o WorkoutGen primeiro como uma PWA pura, com wrapper Capacitor opcional para recursos nativos depois. Isso oferece:

• Experiência core funciona em todo lugar via web (sem necessidade de loja)
• Wrappers de apps nativos disponíveis para descoberta na App Store
• Base de código única com melhorias nativas condicionais
• Deploy de atualizações web instantaneamente, atualizações nativas quando necessário

Os desafios técnicos (e soluções)

Reprodução de vídeo no iOS: bugs antigos do Safari

O problema que não morre:

O Safari no iOS tem bugs persistentes e não corrigidos de reprodução de vídeo que atormentam desenvolvedores de PWA há anos. Isso não é especulação - está documentado no próprio rastreador de bugs do WebKit:

Problemas recentes:

• iOS 26 (2025): Vídeos congelam no primeiro frame após fechar e reabrir a PWA (WebKit Bug #300990)
• iOS 15-18 (contínuo): Streams de vídeo getUserMedia() ocasionalmente exibem tela preta em PWAs (WebKit Bug #252465, reportado em fev 2023, marcado como "corrigido" mas ainda ocorre)

Padrões históricos:

• Bug #232076 (2021): Vídeos de blob URLs consumiam 200-300MB de memória para vídeos de 2MB, levavam 10+ segundos para começar a tocar. Corrigido no iOS 15 após meses de investigação.
• Bug #198277 (2019-2022): Áudio parava de tocar quando PWAs eram colocadas em segundo plano. Levou 3 anos para corrigir (finalmente resolvido no iOS 15.4, fev 2022).
• Relatos no Stack Overflow: Vídeos servidos do diretório /public/ falham ao carregar após atualização de página ou instalação de PWA no Safari (tanto iOS quanto macOS). Solução: hospedar vídeos em CDN externo.

O padrão é claro: bugs de vídeo/mídia em PWAs do Safari são reportados, às vezes marcados como "corrigidos", depois ressurgem em novas versões do iOS.

Minha estratégia de workaround:

Para o WorkoutGen, implementei múltiplas abordagens de fallback:

1. Usar atributo crossorigin="anonymous" em todos os elementos de vídeo
2. Adicionar playsInline, muted e autoPlay para compatibilidade com iOS
3. Pré-carregar metadados de vídeo para reduzir problemas de carregamento
4. Monitorar bugs específicos de versão do iOS e adaptar (vídeos separados para iOS 26)
5. Desenhar UX assumindo que vídeos podem falhar - fornecer instruções de texto como backup

A realidade frustrante: Bugs como #198277 levaram 3 anos para corrigir, e problemas supostamente "resolvidos" como reprodução de vídeo getUserMedia() (#252465) continuam aparecendo em novas versões do iOS. O suporte PWA da Apple claramente recebe menos prioridade que APIs de apps nativos, com correções exigindo "mudanças no nível da plataforma subjacente" em vez de patches rápidos do WebKit.

Sem eventos nativos de instalação no iOS

Problema: O Safari não dispara eventos beforeinstallprompt, tornando impossível:

• Mostrar prompts de instalação nativos programaticamente
• Detectar se usuários já instalaram sua PWA antes do carregamento da página
• Rastrear sucesso de instalação sem ação manual do usuário

Minha solução: Overlays de tutorial em vídeo

Como usuários iOS não podem receber prompts de instalação automáticos, construí um fluxo de onboarding personalizado:

// Lógica de detecção do WorkoutGen
const isPWAInstalled = () => {
  // Detecção iOS
  if (window.navigator.standalone) return true

  // Android/Desktop
  if (window.matchMedia("(display-mode: standalone)").matches) return true

  return false
}

// Mostrar tutorial para navegadores sem beforeinstallprompt
const browserInfo = detectBrowser()
if (!browserInfo.canInstallPWA && !isPWAInstalled()) {
  showVideoTutorial() // Tutorial personalizado com instruções de instalação
}

O WorkoutGen exibe tutoriais em vídeo curtos mostrando aos usuários exatamente como tocar em "Compartilhar → Adicionar à Tela Inicial" no iOS. Os vídeos são contextuais - instruções diferentes para iOS 26 vs. versões anteriores, Safari vs. Chrome no iOS.

Este investimento em UX foi crítico: sem prompts de instalação nativos, a adoção de PWA no iOS depende inteiramente da educação do usuário.

Estratégia de cache do Service Worker

Treinos offline exigem cache agressivo. O WorkoutGen usa Vite PWA Plugin com Workbox:

// Config real do apps/frontend/vite.config.ts
VitePWA({
  registerType: "prompt",
  workbox: {
    globPatterns: ["**/*.{js,css,html,ico,png,svg,woff,woff2}"],
    globIgnores: ["**/*.mp4", "**/*.webm", "**/*.gif", "**/*.jpg", "**/*.jpeg", "**/*.webp"],
    maximumFileSizeToCacheInBytes: 40 * 1024 * 1024,
    cleanupOutdatedCaches: true,
    navigateFallback: null,
  },
})

Decisões-chave:

• Fazer cache de assets estáticos (JS, CSS, fontes) para carregamento instantâneo
• Excluir mídia grande do precache - buscar sob demanda via CDN
• Limite de cache de 40MB para evitar problemas de cota de armazenamento no iOS (Safari limita em 50MB)
• registerType: 'prompt' permite usuários controlarem quando atualizar
• Cache em runtime para mídia de exercícios com estratégia CacheFirst

Isso dá ao WorkoutGen funcionalidade offline completa mantendo-se dentro dos limites de armazenamento do iOS.

O que me decepcionou nas PWAs (e por que ainda sou otimista)

Suporte limitado de navegadores para recursos de instalação

Safari (iOS): Sem evento beforeinstallprompt, sem UI de instalação automática, sem banner de instalação. Usuários devem navegar manualmente pelo menu Compartilhar → "Adicionar à Tela Inicial" - um processo de 4 toques que a maioria das pessoas não sabe que existe.

Firefox (Desktop): Suporte inconsistente à instalação de PWA. Algumas versões suportam, outras não. O botão de instalação aparece de forma imprevisível.

Chrome/Edge (Android): Estes funcionam perfeitamente com prompts de instalação nativos, mas são a minoria globalmente quando você considera a participação de mercado do iOS.

A solução? Construir UX de instalação personalizada para cada navegador. Para o WorkoutGen, implementei:

• Tutoriais em vídeo mostrando passos de instalação no iOS
• Detecção de navegador para mostrar instruções relevantes
• Botões personalizados "Adicionar à Tela Inicial" que acionam guias contextuais
• Fluxos diferentes para iOS 26 vs. versões anteriores

Isso adiciona overhead de desenvolvimento, mas é gerenciável comparado a manter bases de código nativas separadas.

A maioria dos usuários não sabe que PWAs existem

Este é o desafio maior. Quando você diz a alguém "instale este app", eles esperam ir a uma app store. Explicar "na verdade, toque neste botão no seu navegador" cria fricção.

Descobri que duas estratégias funcionam:

1. Não chame de PWA - apenas diga "Adicione à sua tela inicial para a experiência completa"
2. Mostre, não conte - use tutoriais em vídeo que demonstrem o processo de instalação

Educação do usuário é trabalho real, mas vale a pena para evitar taxas de plataforma de 30% e ganhar deploy instantâneo.

Por que ainda sou otimista apesar dessas limitações

A questão é: PWAs são massivamente subestimadas para uma classe específica de aplicações.

Para produtos SaaS, plataformas de conteúdo e ferramentas como WorkoutGen:

• ✅ Você entrega para todas as plataformas desde o dia um (iOS, Android, desktop, web)
• ✅ Experiência em tela cheia, com capacidade offline sem app stores
• ✅ Atualizações instantâneas sem atrasos de revisão
• ✅ Fique com ~90% da receita em vez de 70% (taxas Lemon Squeezy vs. cortes de app store)
• ✅ Relacionamento direto com usuários (sem intermediário de plataforma)

Sim, o suporte do Safari é frustrante. Sim, a consciência do usuário é baixa. Mas estes são problemas de UX solucionáveis, não limitações técnicas fundamentais. A tecnologia core funciona lindamente - é apenas subutilizada porque a maioria dos desenvolvedores escolhe apps nativos por padrão sem avaliar PWAs seriamente.

E a IA/ChatGPT para planejamento de treinos?

O ChatGPT pode gerar planos de treino, mas fica aquém para treinamento sério:

• Sem biblioteca de vídeos de exercícios - O ChatGPT pode descrever exercícios, mas não pode mostrar a forma correta. O WorkoutGen inclui um banco de dados de vídeos customizado cobrindo todos os principais exercícios de musculação com demonstrações profissionais.
• Progressão estruturada - Sem rastreamento de sobrecarga progressiva semanal, periodização ou semanas de deload
• Acesso offline - Requer internet para cada consulta (inutilizável em academias com sinal fraco)
• Memória de personalização - Perde contexto entre sessões a menos que você mantenha manualmente o histórico de conversação
• Sem interface de execução - Você recebe um plano de texto, mas nenhum player de treino para guiá-lo através de séries, períodos de descanso e ordem de exercícios

Construir o banco de dados de vídeos de exercícios do WorkoutGen foi meses de trabalho - filmando, editando, comprimindo e otimizando para reprodução mobile. Isso é algo que a IA não pode fornecer porque opera puramente em texto. A combinação de algoritmos estruturados + demonstrações visuais + acesso offline é onde PWAs brilham sobre IA conversacional.

E o YouTube para tutoriais de treino?

O YouTube é incrível para aprender exercícios, mas terrível para treino real:

• Sem estrutura de treino - Você junta 6 vídeos diferentes
• Anúncios interrompem séries - Mata o momentum no meio do treino
• Sem rastreamento de progressão - Não pode registrar repetições, peso ou melhorias
• Internet necessária - Inutilizável em academias com sinal fraco

Uma PWA te dá o melhor dos dois: conteúdo de vídeo curado dentro de um sistema de treinamento estruturado.

Minha recomendação honesta

Para desenvolvedores construindo apps de fitness/produtividade/SaaS:

• Comece com PWA a menos que você absolutamente precise de APIs nativas (HealthKit, ARKit, Background App Refresh)
• Use React 19 + Vite 7 + Vite PWA Plugin + Workbox para experiência ótima de desenvolvedor
• Adicione Capacitor depois apenas se quiser wrappers nativos opcionais para presença em app store
• Teste em dispositivos iOS reais durante o desenvolvimento - bugs de PWA do Safari vão te surpreender
• Reserve tempo para UX de instalação personalizada (tutoriais em vídeo, detecção de navegador, prompts contextuais)

Para empreendedores e fundadores bootstrapped:

• PWA-first para MVPs - Entregue para todas as plataformas em semanas, não meses, com uma única base de código
• Economia favorece PWAs - Fique com ~90% da receita (Lemon Squeezy 5%+50¢) vs. 70% (app stores 30%)
• Iteração instantânea - Faça deploy de atualizações em segundos sem atrasos de revisão de loja
• App stores opcionais - Adicione wrappers nativos depois para descoberta se necessário, mas produto core funciona em todo lugar via web
• Considere apps nativos apenas após $10K+ MRR para justificar o overhead

Para usuários:

• Experimente a PWA WorkoutGen: my.workoutgen.app
• Instale via menu do navegador: toque em Compartilhar → "Adicionar à Tela Inicial" (iOS) ou botão de instalação do navegador (Android)
• Funciona offline, tela cheia, parece um app nativo - sem o download de 50MB+

A linha de fundo

Depois de construir o WorkoutGen como uma PWA em produção, aqui está o que aprendi:

O bom:

• ✅ Fique com ~25% mais receita por cliente - Lemon Squeezy 5%+50¢ vs. App Store 30%
• ✅ Entregue para todas as plataformas de uma base de código - iOS, Android, desktop, web simultaneamente
• ✅ Faça deploy de atualizações instantaneamente - Sem atrasos de revisão de loja (horas vs. dias)
• ✅ Funcionalidade offline completa - Service Workers fazem cache de tudo que usuários precisam
• ✅ Velocidade de desenvolvimento mais rápida - Sem toolchains de build nativos ou APIs específicas de plataforma

Os desafios:

• ⚠️ Suporte PWA do Safari é frustrante - Bugs de reprodução de vídeo não corrigidos por anos, APIs limitadas
• ⚠️ Sem prompts de instalação automáticos no iOS - Requer UX personalizada e educação do usuário
• ⚠️ Compatibilidade de navegador varia - O que funciona no Chrome pode quebrar no Safari
• ⚠️ Consciência do usuário é baixa - A maioria das pessoas não sabe que PWAs existem
• ⚠️ Sem descoberta em app store - Você precisa de tráfego orgânico ou aquisição paga

O veredito:

PWAs são massivamente subestimadas para casos de uso específicos: ferramentas SaaS, apps de produtividade, plataformas de conteúdo e aplicações como WorkoutGen onde acesso offline estruturado importa mais que posicionamento em app store.

A tecnologia é madura e pronta para produção. Os desafios são principalmente UX e educação do usuário - problemas solucionáveis, não limitações fundamentais. Se você está construindo um app onde pode gerar seu próprio tráfego e quer evitar taxas de plataforma, PWAs oferecem uma alternativa convincente ao desenvolvimento nativo.

O WorkoutGen prova que funciona em escala. Os 2-3 problemas (bugs do Safari, educação do usuário) são largamente superados pelos benefícios: deploy instantâneo, zero taxas de plataforma e alcance verdadeiramente cross-platform.

Guias WorkoutGen para ler a seguir

Para continuar com o mesmo objetivo, lê também:

• Como Instalar o WorkoutGen no iPhone e Android
• Melhores Aplicativos Gratuitos de Fitness e Treino 2025: Classificação Honesta de um Treinador
• Onde Encontrar Planos de Fitness Gratuitos Que Realmente Se Encaixam na Sua Rotina

Referências