PWA Musculation : App Fitness Sans App Store | Guide 2025

La vérité sur la création d'applications sans passer par les App Stores

Vous n'avez pas besoin de la permission d'Apple ou Google pour lancer une application mobile professionnelle. Avec mon ami coach sportif, j'ai créé WorkoutGen - un générateur d'entraînement qui crée des programmes de musculation en salle personnalisés - en tant que Progressive Web App qui fonctionne parfaitement sur tous les appareils sans toucher à l'App Store ou Google Play.

Cet article partage mon expérience concrète de construction et de déploiement d'une PWA en production, incluant les avantages économiques (~30% de revenus en plus par client), les défis techniques (notamment les bugs vidéo de Safari), et les stratégies d'adoption utilisateur que j'ai mises en place. La réalité est plus nuancée que le discours marketing, mais les opportunités sont bien réelles.

Qu'est-ce qui fait une bonne PWA de fitness ?

Une PWA de musculation professionnelle doit offrir (et WorkoutGen implémente tout cela) :

• Architecture offline-first - Entraînements accessibles sans Internet
• Performances natives - Animations fluides, réponses instantanées
• Gestion des médias - Vidéos ou GIFs d'exercices fonctionnant sur toutes les plateformes
• Invites d'installation - Onboarding clair pour les utilisateurs peu familiers avec les PWA
• Intégration des paiements - Facturation directe via Lemon Squeezy (0% de commission plateforme vs 30% des stores)
• Cohérence cross-platform - Expérience identique sur iOS, Android, desktop

Pourquoi j'ai choisi la PWA plutôt que les apps natives

Les arguments économiques sont convaincants

App Stores traditionnels :

• Commission de 30% sur toutes les transactions (Apple, Google)
• Frais de développeur annuels (99-299$)
• Système d'achat in-app obligatoire
• Partage des revenus sur les abonnements (année 1 : 30%, année 2+ : 19%)

PWA + Lemon Squeezy (Merchant of Record) :

• 0% de commission plateforme
• Frais Lemon Squeezy 5% + 0,50$ (inclut traitement paiement + conformité fiscale)
• Lemon Squeezy gère toute la TVA/taxes dans tous les pays - pas besoin de s'enregistrer dans chaque pays
• Contrôle total sur la logique de facturation
• Mises à jour des paiements instantanées (pas de délai de 24-48h comme l'App Store)

Pour un abonnement à 10€/mois, vous conservez 7€ avec les app stores contre ~9€ avec Lemon Squeezy. C'est ~29% de revenus en plus par client. Lemon Squeezy gère 100% de la conformité fiscale et des obligations légales dans tous les pays - vous n'avez rien à déclarer.

La réalité du développement

Et les solutions cross-platform ?

Avant de me lancer à fond dans la PWA, j'ai évalué les principales alternatives cross-platform :

React Native / Flutter : Promettent "écrivez une fois, déployez partout" mais nécessitent toujours :

• Pipelines de build séparés iOS et Android
• Code spécifique aux plateformes pour les fonctionnalités natives
• Soumissions et approbations sur les app stores
• Téléchargements d'app de 40-60MB+
• Apprentissage de Dart (pour Flutter) - un nouveau langage avec un écosystème plus petit que JavaScript

Capacitor (Wrapper hybride) : Utile pour accéder aux API natives, mais ajoute de la complexité :

• Overhead de 15MB juste pour le wrapper
• Toujours besoin d'approbation des app stores pour la distribution
• Perte de l'avantage des mises à jour instantanées des pure web apps
• Mieux utilisé comme amélioration optionnelle, pas comme prérequis

PWA + Capacitor (mon choix) : J'ai construit WorkoutGen comme une pure PWA d'abord, avec un wrapper Capacitor optionnel pour les fonctionnalités natives plus tard. Cela donne :

• L'expérience principale fonctionne partout via le web (pas besoin de store)
• Des wrappers d'apps natives disponibles pour la découverte sur l'App Store
• Une seule codebase avec des améliorations natives conditionnelles
• Déploiement des mises à jour web instantané, mises à jour natives quand nécessaire

Les défis techniques (et leurs solutions)

Lecture vidéo sur iOS : des bugs vieux comme le monde de Safari

Le problème qui ne meurt jamais :

Safari sur iOS a des bugs de lecture vidéo persistants et non corrigés qui tourmentent les développeurs PWA depuis des années. Ce n'est pas de la spéculation - c'est documenté dans le bug tracker de WebKit lui-même :

Problèmes récents :

• iOS 26 (2025) : Les vidéos se figent sur la première image après fermeture et réouverture de la PWA (WebKit Bug #300990)
• iOS 15-18 (en cours) : Les flux vidéo getUserMedia() affichent parfois un écran noir dans les PWA (WebKit Bug #252465, signalé en février 2023, marqué "corrigé" mais toujours présent)

Schémas historiques :

• Bug #232076 (2021) : Les vidéos depuis des blob URLs consommaient 200-300MB de mémoire pour des vidéos de 2MB, mettaient 10+ secondes à démarrer. Corrigé dans iOS 15 après des mois d'investigation.
• Bug #198277 (2019-2022) : L'audio s'arrêtait quand les PWA passaient en arrière-plan. A pris 3 ans à corriger (finalement résolu dans iOS 15.4, février 2022).
• Rapports Stack Overflow : Les vidéos servies depuis le répertoire /public/ ne se chargent pas après rafraîchissement ou installation PWA sur Safari (iOS et macOS). Solution : héberger les vidéos sur un CDN externe.

Le schéma est clair : les bugs vidéo/média dans les PWA Safari sont signalés, parfois marqués "corrigés", puis réapparaissent dans les nouvelles versions iOS.

Ma stratégie de contournement :

Pour WorkoutGen, j'ai implémenté plusieurs approches de secours :

1. Utiliser l'attribut crossorigin="anonymous" sur tous les éléments vidéo
2. Ajouter playsInline, muted et autoPlay pour la compatibilité iOS
3. Précharger les métadonnées vidéo pour réduire les problèmes de chargement
4. Surveiller les bugs spécifiques aux versions iOS et s'adapter (vidéos séparées pour iOS 26)
5. Concevoir l'UX en assumant que les vidéos peuvent échouer - fournir des instructions texte comme solution de secours

La réalité frustrante : Des bugs comme le #198277 ont pris 3 ans à corriger, et des problèmes soi-disant "résolus" comme la lecture vidéo getUserMedia() (#252465) continuent d'apparaître dans les nouvelles versions iOS. Le support PWA d'Apple reçoit clairement moins de priorité que les API d'apps natives, avec des corrections nécessitant "des changements au niveau de la plateforme sous-jacente" plutôt que des patchs WebKit rapides.

Pas d'événements d'installation natifs sur iOS

Problème : Safari ne déclenche pas d'événements beforeinstallprompt, rendant impossible de :

• Afficher des invites d'installation natives programmatiquement
• Détecter si les utilisateurs ont déjà installé votre PWA avant le chargement de la page
• Suivre le succès de l'installation sans action manuelle de l'utilisateur

Ma solution : Overlays de tutoriels vidéo

Comme les utilisateurs iOS ne peuvent pas obtenir d'invites d'installation automatiques, j'ai construit un flux d'onboarding personnalisé :

// Logique de détection de WorkoutGen
const isPWAInstalled = () => {
  // Détection iOS
  if (window.navigator.standalone) return true

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

  return false
}

// Afficher le tutoriel pour les navigateurs sans beforeinstallprompt
const browserInfo = detectBrowser()
if (!browserInfo.canInstallPWA && !isPWAInstalled()) {
  showVideoTutorial() // Tutoriel personnalisé avec instructions d'installation
}

WorkoutGen affiche de courtes vidéos tutoriels montrant aux utilisateurs exactement comment taper "Partager → Sur l'écran d'accueil" sur iOS. Les vidéos sont contextuelles - instructions différentes pour iOS 26 vs versions antérieures, Safari vs Chrome sur iOS.

Cet investissement UX était critique : sans invites d'installation natives, l'adoption des PWA sur iOS dépend entièrement de l'éducation utilisateur.

Stratégie de cache du Service Worker

Les entraînements offline nécessitent un cache agressif. WorkoutGen utilise Vite PWA Plugin avec Workbox :

// Config réelle de 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,
  },
})

Décisions clés :

• Cacher les assets statiques (JS, CSS, polices) pour un chargement instantané
• Exclure les gros médias du precache - récupérer à la demande via CDN
• Limite de cache de 40MB pour éviter les problèmes de quota de stockage sur iOS (Safari plafonne à 50MB)
• registerType: 'prompt' laisse les utilisateurs contrôler quand mettre à jour
• Cache runtime pour les médias d'exercice avec stratégie CacheFirst

Cela donne à WorkoutGen une fonctionnalité offline complète tout en restant dans les limites de stockage iOS.

Ce qui m'a déçu avec les PWA (et pourquoi je reste optimiste)

Support navigateur limité pour les fonctionnalités d'installation

Safari (iOS) : Pas d'événement beforeinstallprompt, pas d'UI d'installation automatique, pas de bannière d'installation. Les utilisateurs doivent naviguer manuellement via le menu Partager → "Sur l'écran d'accueil" - un processus en 4 taps que la plupart des gens ne connaissent pas.

Firefox (Desktop) : Support d'installation PWA incohérent. Certaines versions le supportent, d'autres non. Le bouton d'installation apparaît de manière imprévisible.

Chrome/Edge (Android) : Fonctionnent parfaitement avec les invites d'installation natives, mais ils sont minoritaires mondialement quand on considère la part de marché iOS.

La solution ? Construire une UX d'installation personnalisée pour chaque navigateur. Pour WorkoutGen, j'ai implémenté :

• Des tutoriels vidéo montrant les étapes d'installation iOS
• Détection du navigateur pour afficher les instructions pertinentes
• Boutons "Ajouter à l'écran d'accueil" personnalisés déclenchant des guides contextuels
• Flux différents pour iOS 26 vs versions antérieures

Cela ajoute une charge de développement, mais c'est gérable comparé au maintien de codebases natives séparées.

La plupart des utilisateurs ne savent pas que les PWA existent

C'est le plus gros défi. Quand vous dites à quelqu'un "installez cette app", il s'attend à aller sur un app store. Expliquer "en fait, tapez ce bouton dans votre navigateur" crée de la friction.

J'ai trouvé que deux stratégies fonctionnent :

1. Ne l'appelez pas PWA - dites juste "Ajoutez à votre écran d'accueil pour l'expérience complète"
2. Montrez, ne dites pas - utilisez des tutoriels vidéo qui démontrent le processus d'installation

L'éducation utilisateur est un vrai travail, mais ça vaut le coup pour éviter les frais de plateforme de 30% et obtenir un déploiement instantané.

Pourquoi je reste optimiste malgré ces limitations

Voici la chose : les PWA sont massivement sous-estimées pour une classe spécifique d'applications.

Pour les produits SaaS, plateformes de contenu, et outils comme WorkoutGen :

• ✅ Vous déployez sur toutes les plateformes dès le premier jour (iOS, Android, desktop, web)
• ✅ Expérience plein écran, capable de fonctionner offline sans app stores
• ✅ Mises à jour instantanées sans délais de validation
• ✅ Conservez ~90% des revenus au lieu de 70% (frais Lemon Squeezy 5%+50¢ vs commissions app store 30%)
• ✅ Relation directe avec les utilisateurs (pas d'intermédiaire plateforme)

Oui, le support Safari est frustrant. Oui, la sensibilisation utilisateur est faible. Mais ce sont des problèmes UX solubles, pas des limitations techniques fondamentales. La technologie de base fonctionne magnifiquement - elle est juste sous-utilisée parce que la plupart des développeurs prennent les apps natives par défaut sans évaluer sérieusement les PWA.

Et l'IA/ChatGPT pour la planification d'entraînement ?

ChatGPT peut générer des programmes d'entraînement, mais échoue pour l'entraînement sérieux :

• Pas de bibliothèque vidéo d'exercices - ChatGPT peut décrire les exercices, mais ne peut pas vous montrer la bonne forme. WorkoutGen inclut une base de données vidéo construite sur mesure couvrant tous les exercices de musculation majeurs avec des démonstrations professionnelles.
• Progression structurée - Pas de suivi de la surcharge progressive hebdomadaire, de périodisation, ou de semaines de décharge
• Accès offline - Nécessite Internet pour chaque requête (inutilisable dans les salles avec un mauvais signal)
• Mémoire de personnalisation - Perd le contexte entre les sessions à moins de maintenir manuellement l'historique de conversation
• Pas d'interface d'exécution - Vous obtenez un plan texte, mais pas de lecteur d'entraînement pour vous guider à travers les séries, temps de repos, et ordre des exercices

Construire la base de données vidéo d'exercices de WorkoutGen a pris des mois de travail - filmage, montage, compression, et optimisation pour la lecture mobile. C'est quelque chose que l'IA ne peut pas fournir car elle opère purement en texte. La combinaison d'algorithmes structurés + démonstrations visuelles + accès offline est là où les PWA brillent par rapport à l'IA conversationnelle.

Et YouTube pour les tutoriels d'entraînement ?

YouTube est incroyable pour apprendre les exercices mais terrible pour l'entraînement réel :

• Pas de structure d'entraînement - Vous assemblez 6 vidéos différentes
• Les pubs interrompent les séries - Tue l'élan en plein entraînement
• Pas de suivi de progression - Impossible de logger les reps, le poids, ou les améliorations
• Internet requis - Inutilisable dans les salles avec un mauvais signal

Une PWA vous donne le meilleur des deux : contenu vidéo organisé dans un système d'entraînement structuré.

Mes recommandations honnêtes

Pour les développeurs construisant des apps fitness/productivity/SaaS :

• Commencez avec une PWA sauf si vous avez absolument besoin d'API natives (HealthKit, ARKit, Background App Refresh)
• Utilisez React 19 + Vite 7 + Vite PWA Plugin + Workbox pour une expérience développeur optimale
• Ajoutez Capacitor plus tard seulement si vous voulez des wrappers natifs optionnels pour la présence sur app store
• Testez sur de vrais appareils iOS tout au long du développement - les bugs PWA de Safari vous surprendront
• Budgétez du temps pour une UX d'installation personnalisée (tutoriels vidéo, détection navigateur, invites contextuelles)

Pour les entrepreneurs et fondateurs bootstrappés :

• PWA d'abord pour les MVP - Déployez sur toutes les plateformes en quelques semaines, pas en mois, avec une seule codebase
• L'économie favorise les PWA - Conservez ~90% des revenus (Lemon Squeezy 5%+50¢) vs 70% (app stores 30%)
• Itération instantanée - Déployez les mises à jour en quelques secondes sans délais de validation
• App stores optionnels - Ajoutez des wrappers natifs plus tard pour la découverte si besoin, mais le produit principal fonctionne partout via le web
• Considérez les apps natives seulement après 10K$+ MRR pour justifier la charge

Pour les utilisateurs :

• Essayez WorkoutGen PWA : my.workoutgen.app
• Installez via le menu du navigateur : tapez Partager → "Sur l'écran d'accueil" (iOS) ou bouton d'installation du navigateur (Android)
• Fonctionne offline, plein écran, se sent comme une app native - sans le téléchargement de 50MB+

Le bilan

Après avoir construit WorkoutGen comme une PWA de production, voici ce que j'ai appris :

Les avantages :

• ✅ Conservez ~25% de revenus en plus par client - Lemon Squeezy 5%+50¢ vs App Store 30% (Lemon Squeezy gère toute la conformité fiscale)
• ✅ Déployez sur toutes les plateformes depuis une seule codebase - iOS, Android, desktop, web simultanément
• ✅ Déployez les mises à jour instantanément - Pas de délais de validation (heures vs jours)
• ✅ Fonctionnalité offline complète - Les Service Workers cachent tout ce dont les utilisateurs ont besoin
• ✅ Vélocité de développement plus rapide - Pas de toolchains de build natifs ou d'API spécifiques aux plateformes

Les défis :

• ⚠️ Le support Safari PWA est frustrant - Bugs de lecture vidéo non corrigés depuis des années, API limitées
• ⚠️ Pas d'invites d'installation automatiques sur iOS - Nécessite une UX personnalisée et l'éducation utilisateur
• ⚠️ La compatibilité navigateur varie - Ce qui fonctionne dans Chrome peut casser dans Safari
• ⚠️ La sensibilisation utilisateur est faible - La plupart des gens ne savent pas que les PWA existent
• ⚠️ Pas de découverte via app store - Vous avez besoin de trafic organique ou d'acquisition payante

Le verdict :

Les PWA sont massivement sous-estimées pour des cas d'usage spécifiques : outils SaaS, apps de productivité, plateformes de contenu, et applications comme WorkoutGen où l'accès offline structuré compte plus que le placement sur app store.

La technologie est mature et prête pour la production. Les défis sont principalement UX et éducation utilisateur - des problèmes solubles, pas des limitations fondamentales. Si vous construisez une app où vous pouvez générer votre propre trafic et voulez éviter les frais de plateforme, les PWA offrent une alternative convaincante au développement natif.

WorkoutGen prouve que ça fonctionne à l'échelle. Les 2-3 problèmes (bugs Safari, éducation utilisateur) sont largement compensés par les avantages : déploiement instantané, zéro frais de plateforme, et portée cross-platform véritable.

Guides WorkoutGen à lire ensuite

Pour continuer avec le même objectif, lis aussi :

• Comment installer WorkoutGen sur iPhone et Android
• Meilleures applications de fitness et d'entraînement gratuites 2025 : Classement honnête d'un coach
• Où trouver des plans de fitness gratuits qui correspondent réellement à ton emploi du temps

Références